Impostare l'attributo del valore effettivo di un input con jQuery

Question

Sto cercando di reimpostare l'attributo del valore reale di un input in modo che possa essere ripristinato su quel valore se reimpostato, non necessariamente il valore originale al momento del caricamento del modulo. Il problema è che questi cambiamenti non sembrano avere effetto. Ho provato entrambi:

$(this).attr('value', $(this).val());

e ....

$(this).val($(this).val());

Nessuno di questi cambia effettivamente l'attributo value = " " dell'input, che è ciò che viene utilizzato quando un modulo viene resettato. Il problema è che se qualcuno salva un modulo (tramite AJAX), quindi lo modifica e preme reset (senza salvare questa volta), tornerà ai valori originali con cui è stata caricata la pagina, NON agli ultimi valori salvati con, che è quello che sto cercando di ottenere. So che ci sono modi per aggirare questo problema (memorizzare in variabili locali o qualcosa del genere), ma una soluzione jQuery sarebbe molto meglio. Qualche idea ??

Answer 1

quando stai facendo qualcosa del genere:

$(this).val($(this).val());

si traduce davvero in:

var temp = $(this).val());
$(this).val(temp);

Quindi, in sostanza, sta semplicemente riportando lo stesso valore.

Quello che vorrai fare è sul caricamento del documento o sulla richiesta AJAX, memorizzare il valore in una variabile e poi recuperarlo quando il modulo viene resettato.

Answer 2

Sembra un bel trucco, eccone un altro.

Puoi modificare il DOM sostituendo l'intero elemento, quindi invece di:

$('#my_input').val("new_value_here");

puoi usare:

$('#my_input').replaceWith(' < input type="text" value="new_value_here" />');

Answer 3

Ho trovato una soluzione per questo ...

Quando si salva un modulo (tramite AJAX, sul callback di successo):

// Set 'savedValue' attr on elements (for when reset, will reset to last saved values)
$('#myForm input').each(function() {
    $(this).attr('savedValue', $(this).val());
});

Quando è necessario ripristinare il modulo:

// Reset form
if($('#myForm input:first').attr('savedValue')!=undefined) {
    // Have saved values, reset to last saved values
    $('#myForm input').each(function() {
        $(this).val($(this).attr('savedValue'));
    });
}
else {
    // No saved values, reset form
    $('#myForm')[0].reset();    
}

Funziona perfettamente con le caselle di testo e con un po 'di modifica potresti farlo funzionare con qualsiasi tipo di input. Ho molti input quindi volevo evitare di salvarli / ripristinarli manualmente, se possibile. Questo sarebbe un buon plugin ... forse domani

Answer 4

Usa thing.value = " foo " ;; Controlla se funziona quando l'oggetto è un oggetto jQuery e un normale oggetto DOM. usando attr ('value', $ (this) .val ()) non funzionerà come vuoi

Answer 5

Ancora meglio di una variabile locale, è possibile utilizzare i metodi jQuery Data per memorizzare i valori di ripristino insieme all'elemento da ripristinare.

Durante il salvataggio:

$(this).data("ResetValue", $(this).val());

Al ripristino:

$(this).val($(this).data("ResetValue"));

Cambiando i selettori in modo appropriato e probabilmente aggiungendo il controllo indefinito come menzionato da Ryan.