évènement onclick sur boutons radio
Bonjour, je suis ultra débutant en javascript et je n'y connais donc ultra rien.
voici le soucis, j'ai un formulaire en multi-étapes généré grâce à un plugin jquerry trouvé par ci et la sur le net.
il fonctionne excellemment bien.
Le soucis qui m'oppose est que selon le clic qui sera fait sur un input, de type radio, je souhaite affiché un élément,
jusque la pas de problème j'ai pu me débrouiller tant bien que mal, voici comment j'ai procédé.
dans les balises <HEAD></HEAD>
Partie réservée au javascript:
Code:
1 2 3 4 5 6 7 8 9 10 11 12
| <script type="text/javascript">
function pm ()
{
document.getElementById("pm").style.display = "block";
}
function pp ()
{
document.getElementById("pp").style.display = "block";
}
</script> |
Partie réservée au css:
Code:
1 2 3 4 5 6
| #pm{
display: none;
}
#pp {
display: none;
} |
Dans les balises <BODY></BODY>
Code:
1 2 3
| <label for="categorie">Catégorie</font></b></label>
<input type="radio" name="categorie" value="personne_morale" onclick="pm();" />Personne morale
<input type="radio" name="categorie" value="personne_physique" onclick="pp();" />Personne physique |
et l'élément qui s'affiche ou pas.
Dans le body j'ai pu mettre ce bloc à l'endroit ou il doit s'afficher:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30
| <fieldset>
<legend>Informations légales</legend>
<div id="pm"> <label for="raison_sociale"><b><font size="2" face="Verdana">Raison sociale</font></b></label>
<input id="raison_sociale" type="text" />
<label for="nom_commercial"><b><font size="2" face="Verdana">Nom commercial</font></b></label>
<input id="nom_commercial" type="text" />
<label for="forme_juridique"><b><font size="2" face="Verdana">Forme Juridique</font></b></label>
<select onchange="if(this.selectedIndex == 7) document.getElementById('forme_juridique2').style.display = 'block';
else document.getElementById('forme_juridique2').style.display = 'none';" name="test">
<option>E.U.R.L.</option>
<option>S.A.R.L.</option>
<option>S.A.</option>
<option>S.N.C.</option>
<option>Société Particulière</option>
<option>S.D.F</option>
<option>Coopérative</option>
<option value="autre">Autre</option>
</select>
<input id="forme_juridique2" type="text" style="display:none;" />
<label for="siret"><b><font size="2" face="Verdana">Siren ou Siret</font></b></label>
<input id="siret" type="text" / maxlength="14">
<label for="code_ape"><b><font size="2" face="Verdana">Code APE</font></b></label>
<input id="code_ape" type="text" />
<label for="capital"><b><font size="2" face="Verdana">Capital social</font></b></label>
<input id="capital" type="text" />
<label for="activite"><b><font size="2" face="Verdana">Activité</font></b></label>
<input id="actvitite" type="text" />
</div>
</fieldset> |
Le soucis est que lorsque le bouton radio devient décoché l'élément reste affiché au détriment du deuxième, à savoir les deux éléments s'affichent or ce n'est pas possible si mon utilisateur s'est trompé, en fonction des desiderata des clients il y a 50% de chance que cela arrive.
Je ne peux pas laisser place au hasard. et je souhaites enlever toutes équivoques à ce problème/
D'avance merci pour votre aide.