11521 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous !

Je souhaiterai savoir s'il existe un petit truc afin de réinitialiser un pseudo formulaire simplement en quittant la page.
Car actuellement les choix sélectionnés restent malgré le fait de revenir en arrière sur les pages précédentes.
Je précise que l'ensemble du site est contenu sur une seule page index.html

J'ai bien essayé le fameux data-history="false" mais ca ne fonctionne pas.

Voici un bout de mon code :

<fieldset data-role="controlgroup">
<select name="Choix1" id="Choix" style="text-align:center;">
<option>Option1</option>
<option>Option2</option>
</select>						
<select name="Choix2" id="Choix" style="text-align:center;">
<option>Option1-1</option>
<option>Option2-2</option>
</select>		
</fieldset>

Modifié par Gianni54 (18 Jun 2016 - 10:29)
Gianni54 a écrit :
Bonjour à tous !
Je souhaiterai savoir s'il existe un petit truc afin de réinitialiser un pseudo formulaire simplement en quittant la page.
Car actuellement les choix sélectionnés restent malgré le fait de revenir en arrière sur les pages précédentes.
Je précise que l'ensemble du site est contenu sur une seule page index.html
J'ai bien essayé le fameux data-history="false" mais ca ne fonctionne pas.
Voici un bout de mon code :
&lt;fieldset data-role="controlgroup"&gt;
&lt;select name="Choix1" id="Choix" style="text-align:center;"&gt;
&lt;option&gt;Option1&lt;/option&gt;
&lt;option&gt;Option2&lt;/option&gt;
&lt;/select&gt;						
&lt;select name="Choix2" id="Choix" style="text-align:center;"&gt;
&lt;option&gt;Option1-1&lt;/option&gt;
&lt;option&gt;Option2-2&lt;/option&gt;
&lt;/select&gt;		
&lt;/fieldset&gt;

Faute de précision, je m'en tiendrai à l'expression "réinitialiser un pseudo formulaire" contenue dans ton sujet pour considérer que ton besoin est de réinitialiser les champs présents dans un FIELDSET, sans avoir à revenir sur la page précédente...
Dans un développement récent, j'avais N balises FORM sur une même page, contenant elles-mêmes N balises FIELDSET, pour lesquelles l'utilisateur devait pouvoir compléter des champs de saisie ou les remettre à leurs valeurs par défaut.
Pour répondre à ce besoin, chaque FORM comportait une balise BUTTON avec l'attribut @type à "reset" et un libellé "Réinitialiser", tout simplement.
Attention, le reset s'applique (sauf erreur de ma part) à l'ensemble des champs présents dans la balise FORM en question, c'est à dire à tous ses FIELDSET présents sur ce formulaire. Si tu veux faire une réinitialisation ciblée, il faudra alors recourir à javascript.
Point à confirmer / infirmer éventuellement par les autres intervenants du forum.
Je ne sais pas si cela répond exactement à ton besoin... sauf à ce que tu apportes quelques précisions complémentaires sur la cinématique exacte du processus que tu veux mettre en place.
Modifié par sepecat (18 Jun 2016 - 10:48)
J'aurai pu développer un peu plus effectivement Smiley confuse

Ce que tu décris est exactement ce que je voudrais faire (réinitialiser le contenu du fieldset).
A la différence que je ne veux pas le faire faire à la mano par l'utilisateur (avec un bouton reset à cliquer) mais que cela se fasse automatiquement des que l'on quitte la page (bouton "back" contenu dans le header)

Et une fois que l'on revient sur cette page tout est réinitialisé pour éviter d'avoir à changer les précédent choix.
D'autant plus que le code que j'ai fourni ne le précise pas mais en premier choix il sera inscrit "faites votre choix :" dans une valise option.

Cest pour cela que j'avais tenté le data-history="false" dans mon header sur le bouton back mais cela n'a aucun effet...

Je pense qu'un script devra être réalisé... Mais je voulais savoir si une petite option avais été prevu dans jquery mobile pour cela mais après quelques recherches => choux blanc...
Comme il ne semble pas y avoir d'option toute faite pour cela dans JQM
Voici un début de réponse :

Utiliser un script pour forcer la page à rafraichir à chaque fois.
J'ai essayé ceci :

jQuery('div').live('pagehide', function(event, ui){
      var page = jQuery(event.target);

      if(page.attr('data-cache') == 'never'){
        page.remove();
      };
});


J'ai inséré ceci dans ma balise du header <div data-role="page" id="maPage" data-cache="never">

Par contre, le problème c'est que le lien vers cette page ne fonctionne tout simplement plus une deuxième fois... Je dois mal l'utiliser ou ce script n'est pas adapté (conflit) dans JQM

Une idée ?