Masquer des champ selon les bouton radio

Résolu
Mariana -  
 Benny -
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>

2 réponses

  1. Mariana
     
    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
  2. Mike
     
    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
    1. Mariana
       
      Je suis désolée ça ne marche pas!!!

      Aidez moi!!!!!!!!!!!!!!!!
      0
    2. Mike
       
      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
    3. Mariana
       
      Oui Merciiiiiiiiiiiiiiiiiiiiiiii
      ça marche très bien !!!
      ça était une faute de frappe
      0
    4. Benny
       
      tu claque, j'ai adapter et ça fonctionne nickel !!!!!
      Merciiiiiii
      0