Masquer des champ selon les bouton radio

Résolu/Fermé
Mariana - Modifié par Mariana le 20/04/2010 à 19:21
 Benny - 2 janv. 2012 à 16:21
Salut,

J'aimerai bien afficher et masquer des champ text selon le choix de bouton radio. J'ai essayé plusieurs codes mais rien ne s'affiche. Je souhaite bien que vous pourriez m'aider.
C'est en php que je travaille!!!!!!

Voici la fonction javascript que j'ai utilisé:

<script language="javascript">
function choixPersonne()
{
var a = document.getElementById("chauffeur");
var b= document.getElementById("sous_traitant");
if (document.form1.personne.id == "ouiCli"){

a.style.display = "block";
b.style.display = "none";
}
else if (document.form1.personne.value== "nonCli"){

a.style.display = "none";
b.style.display = "block";
}

}
</script>



les bouton radio de mon formulaire:
<input type="radio" name="personne" id="ouiCli" value="oui" onchange="choixPersonne()" /> Chauffeur:
<input type="radio" name="personne" id="nonCli" value="non" onchange="choixPersonne()" /> Sous Traitant:


Les champs à masquer:

<div id="chauffeur" style="display:none"><fieldset class="Style7">
<label> <br />
<br />
Nom:
<input name="nom_chauffeur" id="nom_chauffeur" type="text" />
N° CIN:
<input name="num_cin_chauffeur" id="num_cin_chauffeur" type="text">

</fieldset></div>
<div id="sous_traitant" style="display:none"><fieldset class="Style7">
<p>Nom sous-Traitant:
<input name="nom_sous_traitant" id="nom_sous_traitant" type="text" />
</fieldset></div>
A voir également:

2 réponses

Salut à tous,

Maintenant j'ai reussi à afficher les données du sous traitant donc le fieldset après <div id="sous_traitant" style="display:none">
mais quelque soit le bouton sélectionné l'affichage ne change pas

Je souhaite que vous m'avez compris et que vous pourriez m'aider!

Voici mon code du la fonction javascript:

<script language="javascript">
function choixPersonne()
{
var a = document.getElementById("chauffeur");
var b= document.getElementById("sous_traitant");
if (document.form1.personne.value="oui"){

a.style.display = "block"; b.style.display = "none";

}
if (document.form1.personne.value="non") {

b.style.display = "block"; a.style.display = "none";

}

}
</script>


Merci d'avance
0
Tiens voilà une solution qui fonctionne mais qui n'est pas la plus propre que je connaisse, mais désolé j'ai pas trop le temps d'y regarder.

<script language="javascript">
function choixPersonne(chaine)
{
var a = document.getElementById("chauffeur");
var b= document.getElementById("sous_traitant");

if (chaine == 'cacher1'){

a.style.display = "block";
b.style.display = "none";
}
else if (chaine == 'cacher2'){

a.style.display = "none";
b.style.display = "block";
}

}
</script>

<form name='form1'>
<input type="radio" name="personne" id="ouiCli" value="oui" onchange="choixPersonne('cacher1')" /> Chauffeur:
<input type="radio" name="personne" id="nonCli" value="non" onchange="choixPersonne('cacher2')" /> Sous Traitant:
</form>

Les champs à masquer:
<div id="chauffeur" style="display:none">
	<fieldset class="Style7">
	<label> <br />
	<br />
	Nom:
	<input name="nom_chauffeur" id="nom_chauffeur" type="text" />
	N° CIN:
	<input name="num_cin_chauffeur" id="num_cin_chauffeur" type="text">

	</fieldset></div>
	<div id="sous_traitant" style="display:none"><fieldset class="Style7">
	<p>Nom sous-Traitant:
	<input name="nom_sous_traitant" id="nom_sous_traitant" type="text" />
	</fieldset>
</div>
0
Je suis désolée ça ne marche pas!!!

Aidez moi!!!!!!!!!!!!!!!!
0
Euhh je viens de réessayer mon code et il fonctionne.

Essaye tout simplement de recopier mon code dans une page html et teste le.
0
Oui Merciiiiiiiiiiiiiiiiiiiiiiii
ça marche très bien !!!
ça était une faute de frappe
0
tu claque, j'ai adapter et ça fonctionne nickel !!!!!
Merciiiiiii
0