Formulaire conditionnel utilisant jQuery et les cookies

Question

J'ai deux formulaires différents sur mon site Web: un pour soumettre une demande générale et un autre pour commander des choses. En cliquant sur un bouton radio, l'utilisateur peut choisir le formulaire dont il a besoin.

J'ai créé le formulaire dans un système de gestion de contenu qui vérifie si les données du champ de texte sont entrées correctement après l'envoi du formulaire. Si le système détecte une erreur, la page est rechargée et le formulaire réapparaît en affichant un message d'erreur.

Je voudrais stocker la sélection que l'utilisateur a faite pour afficher automatiquement le formulaire correct après que la page ait été rechargée. Un tutoriel sur Onextrapixel explique quelque chose de similaire et j'essayais de le modifier en fonction de mes besoins. Le code suivant montre le script que j'utilise. J'ai essayé de .hide() ou .show() le contenu spécifique en fonction du bouton radio cliqué. Cacher le bon contenu fonctionne sans problème si je désactive le cookie. Le problème commence si j'active le plugin Cookie et que je n'arrive pas à comprendre ce qui ne va pas. S'il vous plaît gardez avec moi, je suis assez nouveau à jQuery.

est ici le plus important code source HTML:

<form action="kontakt.html" id="f3" method="post"> 
    <div id="ctrl_29" class="radio_container aboveage2"> 
     <input type="radio" name="age2" id="opt_29_0" class="radio" value="anfrage" /> 
     <label id="lbl_29_0" for="opt_29_0">radio1</label> 

     <input type="radio" name="age2" id="opt_29_1" class="radio" value="rezept" /> 
     <label id="lbl_29_1" for="opt_29_1">radio2</label> 
    </div> 
</form> 

<div id="parent2"> 
    <form action="kontakt.html" id="f1" method="post"> 
     <p>Name:</p> 
     <input type="text" name="Name" id="ctrl_1" class="text mandatory" value="" /> 
     <input type="submit" id="ctrl_99" class="submit" value="Absenden" /> 
    </form> 
</div> 

<div id="parent3"> 
    <form action="kontakt.html" id="f5" method="post"> 
     <p>E-Mail:</p> 
     <input type="text" name="Email" id="ctrl_56" class="text mandatory" value="" /><br /> 
     <input type="submit" id="ctrl_63" class="submit" value="Absenden" /> 
    </form> 
</div> 

Je Fould des questions similaires ici sur Stack Overflow, mais je ne pouvais pas comprendre.

Toutes les idées seraient super, merci!

Answer 1

Après un peu de sommeil je l'ai un peu compris. L'ensemble du code n'était pas bien trié. Voici le code qui fonctionne pour moi:

$(document).ready(function() { 
    var auswahl_radio = $.cookie('auswahl_radio'); 

    if (auswahl_radio == 'radio_allgemein') { 
     $("#form_allgemein").show(); 
     $('#opt_29_0').attr('checked', 'checked'); 
    } else if (auswahl_radio == 'radio_rezept') { 
     $("#form_rezept").show(); 
     $('#opt_29_1').attr('checked', 'checked'); 
    } else { 
     $("#form_allgemein").css("display","none"); 
     $("#form_rezept").css("display","none"); 
    } 

    $(".kontakt_anliegen").click(function() { 
     if ($('input[name=anliegen]:checked').val() == "anfrage") { 
      $("#form_rezept").hide(); 
      $("#form_allgemein").slideDown("fast"); 
      $.cookie('auswahl_radio', 'radio_allgemein'); 
     } else { 
      $("#form_allgemein").hide(); 
      $("#form_rezept").slideDown("fast"); 
      $.cookie('auswahl_radio', 'radio_rezept'); 
     } 
    }); 
}); 

Dans mon CSS je mets les <div> s à display:none;.