Crea pagina per dire al browser di non memorizzare nella cache / conservare i valori di input


116

La maggior parte dei browser memorizza nella cache i valori di input del modulo. Quindi, quando l'utente aggiorna una pagina, gli input hanno gli stessi valori.

Ecco il mio problema. Quando un utente fa clic su Salva , il server convalida i dati POST (ad es. Prodotti selezionati) e, se non validi, li invia di nuovo al browser. Tuttavia, come affermato sopra, anche se il server cancella la selezione per alcuni valori, potrebbero comunque essere selezionati a causa della cache del browser!

I miei dati hanno caselle di controllo invisibili (fino a quando non viene selezionato l'elemento genitore), quindi l'utente potrebbe anche non essere a conoscenza del fatto che un valore precedente è ancora selezionato, finché non fa nuovamente clic su Salva e riceve un messaggio di errore, anche se l'utente pensa che non lo sia. Il che è irritante.

Questo può essere risolto facendo Ctrl+ F5, ma non è nemmeno una soluzione. Esiste un modo automatico / programmatico per dire al browser di non memorizzare nella cache i dati di input del modulo su un modulo / pagina?


1
È <form autocomplete="off"...un'opzione per te? Questo problema si verifica su tutti i browser o solo su uno in particolare?
David Kolar

C'è un modo per rispondere a questa domanda con riferimento agli <select>elenchi a discesa . Ho un elenco e ho definito una selectedscelta, ma l'aggiornamento della pagina mantiene le opzioni selezionate in precedenza.
Martin

Voglio ottenere il contrario: preservare i valori di input di ciascuna pagina sul pulsante Indietro (fare clic due volte indietro per ottenere gli input di conseguenza). Ci sono vari esempi sull'utilizzo di molto codice JS, (che non funziona davvero IMHO) ma - esiste un modo più semplice? Ho provato autocomplete = "on" su entrambi i campi del modulo e di input, non funziona. Il browser è Chrome.
Dmitry z

Risposte:


197

Stai impostando esplicitamente i valori come vuoti? Per esempio:

<input type="text" name="textfield" value="">

Ciò dovrebbe impedire ai browser di inserire i dati dove non dovrebbero. In alternativa, puoi aggiungere l' autocompleteattributo al tag del modulo:

<form autocomplete="off" ...></form>

1
Parlo di caselle di controllo quindi non posso impostare il valore su "". Inoltre, il completamento automatico disattivato significa non memorizzare i valori di input del modulo "quando l'utente preme F5", non solo "per l'elenco di completamento automatico a discesa"?
regina3

2
Secondo developer.mozilla.org/en/How_to_Turn_Off_Form_Autocompletion , autcompletion = off influisce sulla "cache della cronologia della sessione", almeno in Gecko. Proverò se funziona per quello che mi serve.
regina3

1
@ queen3: Sì, le caselle di controllo sono un problema poiché non c'è modo di dire esplicitamente "non controllato". Se continui ad avere problemi, potresti provare checked="false", potrebbe funzionare in alcuni browser. Un'altra alternativa è usare Javascript / jQuery per deselezionare esplicitamente tutte le caselle di controllo al caricamento della pagina.
Capra scontenta

1
@ queen3, intendi "autocomplete = off" non "autocompletion = off"
Matt Baker

2
Tutte le risposte e i suggerimenti non hanno funzionato per me. Utilizzo di chrome e sviluppo di .net
hakan

45

Da un riferimento di Stack Overflow

Non ha funzionato con value = "" se il browser salva già il valore quindi è necessario aggiungerlo.

Per un tag di input c'è l'attributo autocomplete che puoi impostare:

<input type="text" autocomplete="off" />

Puoi utilizzare il completamento automatico anche per un modulo.


9
In Chrome, sembra autocomplete="off"non abbia alcun effetto se utilizzato su singoli elementi del modulo, anche con l' valueattributo impostato esplicitamente vuoto e durante l'invio di Cache-Control: Must-Revalidateun'intestazione, ciò non ha avuto alcun effetto. Ho dovuto applicare l' autocomplete="off"attributo <form>all'elemento stesso per sopprimere questo comportamento in Chrome.
mindplay.dk

Ho completato il completamento automatico = "off" sul modulo ma non ha funzionato per me
Kingsley Simon,

Ho bisogno di maggiori informazioni su @KingsleySimon come browser e potresti avere alcune impostazioni sul tuo browser che impediscono il comportamento corretto
Shareef

1
sembra che il comportamento del browser sia cambiato: developer.mozilla.org/en-US/docs/Web/Security/…
david

e da notare il modulo html valido. e per esempio non è una forma all'interno di un altro ecc.
Shareef

10

Un altro approccio potrebbe essere quello di ripristinare il modulo utilizzando JavaScript subito dopo il modulo nell'HTML:

<form id="myForm">
  <input type="text" value="" name="myTextInput" />
</form>

<script type="text/javascript">
  document.getElementById("myForm").reset();
</script>

8

Fondamentalmente, ci sono due modi per svuotare la cache:

<form autocomplete="off"></form>

o

$('#Textfiledid').attr('autocomplete', 'off');

6

Questo ha funzionato per me nei browser più recenti:

autocomplete="new-password"
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.