web-dev-qa-db-fra.com

Pourquoi la case à cocher reste-t-elle cochée lors du rechargement de la page?

Je recharge une page Web contenant le code suivant:

<label for="showimage">Show Image</label>
<input id="showimage" name="showimage" type="checkbox" value="1" />

Même si le code HTML reste envoyé au navigateur est le même pour chaque rechargement de la page, la case à cocher prend toujours la valeur vérifiée lorsqu'un rechargement a été effectué. En d'autres termes, si l'utilisateur coche la case et recharge, la case est toujours cochée.

Y a-t-il une mise en cache qui se passe ici? 

Edit : J'ai essayé la solution de Gordon Bell ci-dessous et constate que cela se produit même après la suppression de la valeur = "1". Quelque chose d'autre pourrait me manquer?

<label for="showimage">Show Image</label> 
<input id="showimage" name="showimage" type="checkbox" />
firefox
67
Readonly

Oui, je crois que c'est la mise en cache. Je vois ce comportement sur Firefox par exemple (pas Safari, pour ce que ça vaut :)).

vous pouvez recharger la page et contourner le cache (sur Firefox) en utilisant CTRL-SHIFT-R et vous verrez que la valeur de contrôle ne porte pas (un normal CTRL-R va récupérer les informations de la cache cependant)

edit: J'ai pu désactiver ce côté serveur sous Firefox, en définissant un en-tête de contrôle du cache:

Cache-Control: no-store

cela semble désactiver la fonctionnalité "Mémoriser les valeurs de formulaire" de Firefox

34
Owen

Ajoutez autocomplete="off" dans l'élément de formulaire de la page. L'inconvénient est que ce n'est pas XHTML valide, mais cela corrige le problème sans javascript compliqué.

133
ironbirdman

set autocomplete = "off" avec js fonctionne également bien.

par exemple en utilisant jquery:

$(":checkbox").attr("autocomplete", "off");
29
RainChen

C'est une fonctionnalité intéressante de Firefox: si vous tapez quelque chose mais rechargez la page, le texte reste dans la zone de texte. Idem pour les autres paramètres que vous avez choisis.

Hélas, cela ne fonctionne pas dans SO (probablement réinitialisé par JS) et des navigateurs plus lents comme IE ...

Ce qui suggère une solution: si vous en avez vraiment besoin, réinitialisez le formulaire avec JS. form.reset () peut faire le travail (agit comme le bouton de réinitialisation).

1
PhiLho

$ ("# showimage"). prop ("vérifié", faux);

0
Sumit Mehta

C'est une vieille question, mais toujours un problème actif pour Firefox. Aucune des réponses que j'ai essayées n'a résolu le problème, mais que l'a fait a résolu pour moi était simplement ceci:

    document.getElementById('formId').reset();

Cela réinitialise simplement le formulaire aux options par défaut à chaque chargement de la page. Ce n’est pas idéal puisque vous perdez le contrôle granulaire, mais c’est la seule chose qui a résolu ce problème pour moi.

0
cmshnrblu

Cela peut être dû à la mise en cache du navigateur - très utile pour les sites Web statiques qui ne sont pas modifiés trop souvent, très mauvais pour les applications Web dynamiques .
Essayez avec ces deux balises méta dans la section principale de la page. La seconde balise meta est destinée aux anciens navigateurs (IE5) qui ne reconnaissent pas la méta-balise "sans cache" et qui, bien que différents, produisent le même résultat: chaque demande est envoyée au serveur.

<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Expires" CONTENT="-1">
0
Aleksandar

l'idée publique de résoudre ce problème 

faire formulaire et bouton de réinitialisation 

<form>
<checkbox>
<reset>
</form>

$(reset).trigger("click");//to clear the cache and input 
$(checkbox).trigger("click");//to mark checkbox
0
Mohamed Gomah

ou au lieu de f5, appuyez sur Entrée dans la barre d'adresse :)

0
Ionuț Staicu