Griser ou non une liste déroulante en fonction d'une autre

[Bobez]

Bonjour,

J'ai beau essayer, mais je n'y arrive pas (je suis nul en javascript). J'ai deux listes déroulantes et je cherche à désactiver la seconde si l'utilisateur a choisi dans la première certaines valeurs.

Par exemple, prenons ce formulaire tout simple :

<form name="form" method="post" action="">
<select name="test"><option value="option1">griser</option><option value="option2">ne pas griser</option><option value="option3">griser</option></select>
<select name="select"><option value="#">selectionner</option></select>
</form>

Je voudrais que la deuxième liste se grise si l'on sélectionne option1 ou option3 dans la première liste, et que par contre elle ne se grise pas (ou bien se dégrise si elle a été grisée auparavant) si on sélectionne option2.

Merci beaucoup !

 

[François]

Bonjour,

A ma connaissance il n'existe pas de propriété "enabled" pour les listes déroulante.

Tu va être obligé de faire autrement : verifier le choix à la validation du formulaire par exemple.

Ou alors remplir la seconde liste en fonction du 1er choix.

Un petit lien pour des tutoriels JS : www.toutjavascript.com

A+

 

[Bobez]

Salut,

J'ai vu sur le net qu'il existait bien une propriété "disabled" ! Exemple :

 <form>
 <select name="liste1" onchange="if (this.selectedIndex > 0){this.form.liste2.disabled = false;}"> 
 <option>Choisir</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 </select> 

 <select name="liste2" disabled> 
 <option>Choisir</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 <option>...</option> 
 </select>
 </form>

Mais je n'arrive pas à faire précisément ce que j'ai décrit plus haut...

 

[Bobez]

Up, svp

 

[Oncle Tom]

Heu j'vois pas le problème : ça marche sans accroche. Quand tu sélectionnes un élément de la première liste, ça active la seconde.

 

[François]

Slt !

Autant pour moi, j'avais cherché ( y a quelque temps, 1 ou 2 ans ) sans trouver.

Ca a changé ou faut que je change de lunettes ? :lol:

A+

 

[Bobez]

Heu j'vois pas le problème : ça marche sans accroche. Quand tu sélectionnes un élément de la première liste, ça active la seconde.

Certes, mais ce que je cherche à faire, c'est qu'en fonction de l'élément sélectionné dans la première liste, cela active ou désactive la deuxième !

 

[Bobez]

J'ai trouvé la soluce, je met ça ici au cas où ça intéresse quelqu'un. C'est facilement adaptable à ses besoins.

<script language="JavaScript" type="text/javascript">
function griser() {
with(document.form) {
if(test.options[test.options.selectedIndex].value=="option3") select.disabled=true;
else select.disabled=false;
}
}
</script>


<form name="form" method="post" action="">
<select name="test" onChange="griser();"><option value="option1">ne pas griser</option><option value="option2">ne pas griser</option><option value="option3">griser</option></select>
<select name="select"><option value="#">selectionner</option></select>
</form>