2 Menus déroulants dépendant d'un autre

Version imprimable

Bonjour,

Je suis en peu dans le pétrin, si vous pouviez m'aider, j'en serais heureux. Je m'explique:

1. J'ai un menu déroulant (celui avec la petite flèche bleue au bout) qui contient des noms d'équipes (8 en tout) c'est mon menu 1

2. J'ai un autre menu déroulant qui contient des noms d'équipe (8 autres en tout) c'est le menu 2

3. C'est la que j'ai de la misère à faire, je veux faire un 3ieme menu déroulant en fonction des 2 autres. Exemple si l'utilisateur sélectionne un nom d'équipe dans le menu 1 (ex: toto). Ensuite il sélectionne un autre nom d'équipe dans le menu 2 (ex: tata). Donc j'aimerais bâtir mon menu 3 qui contiendrait seulement les noms toto et tata.

Comme ça dans mon menu 3 je pourrais demander aux utilisateurs qui va gagner entre toto ou tata. Selon ce qu'il a sélectionné (toto ou tata) je vais pouvoir l'enregistrer dans ma bd sql.

Voici mon petit bout de code:
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 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 <form name="prequipe" action="frmprequipe.php" method="post"> <p align="center" style="margin-top: -11"><b><font color="#FF0000">CONFÉRENCE EST</font></b></p> <P align="left"><b>Votre première équipe</b> <table width="84%"> <tr> <td> <b>Votre équipe: </b> <select id="eq1" name="eq1"> <option value="-1">????????????</option> <option value="toto">toto</option> <option value="blabla">blabla</option> . . . </select></td> <td id="eqp1_check"> </td> </tr> </table> <HR> <P align="center" style="margin-top: -4"><b><font color="#FF0000">CONFÉRENCE OUEST</font></b> <P align="left"><b>Votre deuxième équipe</b> <table width="84%"> <tr> <td> <b>Votre équipe: </b> <select id="eq2" name="eq2"> <option value="-1">????????????</option> <option value="tata">tata</option> <option value="ole">ole</option> . . . </select></td> <td id="eqp2_check"> </td> </tr> </table> <HR> <P align="center"><b><font color="#FF0000">VOTRE ÉQUIPE GAGNANTE</font></b> <table width="84%"> <tr>  <td><b>Choisir votre équipe gagnante: </b> <select id="select" name="select" onClick="??????????()"> <option value="-1">????????????</option> <option value="xxxx">xxxx</option> <option value="zzzz">zzzz</option> </select> --> </td> <td id="eqp3_check"> </td> </tr> </table> <P align="left"> <P align="left">   <P align="center"> <input type="button" name="eqp" value="Envoyer" onClick="verifForm(this)"></a> </form>
Merci de votre aide !
Bye

19/03/2009, 06h45
andry.aime

Salut,
:recherch:
Tu auras du lire le début de message du forum javascript, il y a un lien pour les Listes déroulantes liées entre elles.
:faq: :tutoriel:
19/03/2009, 17h59
lavm01

J'ai trouvé

Avec de l'amour et de la patience..

Voici mon code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>test menu deroulant</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="javascript">
var d=new Date();
var monthname=new Array("Janvier","Février","Mars","Avril","Mai","Juin","Juillet","Août","Septembre","Octobre","Novembre","Décembre");
var TODAY = monthname[d.getMonth()] + " " + d.getDate() + ", " + d.getFullYear();

function selbte1(id,pos) {

var x=document.getElementById("eq3");
txt=document.getElementById(id).value;
x.options[pos] = new Option(txt,txt);
//x.options[1] = new Option("TEST2", "B");
}

</script>
<style type="text/css">

</style>
</head>
<body bgcolor="#C0DFFD">

<form name="prequipe" action="frmprequipe.php" method="post">
<p align="center" style="margin-top: -11"><b><font color="#FF0000">CONFÉRENCE EST</font></b></p>
<P align="left"><b>Votre première équipe</b>

<table width="84%">
<tr>
<td>
<b>Votre équipe: </b>
<select id="eq1" name="eq1" onChange="selbte1('eq1',1)">
<option value="-1">????????????</option>
<option value="Buffalo">Buffalo</option>
<option value="NY Islanders">NY Islanders</option>
<option value="Montréal">Montréal</option>
</select></td>
<td id="eqp1_check"> </td>
</tr>
</table>
<HR>
<P align="center" style="margin-top: -4"><b><font color="#FF0000">CONFÉRENCE OUEST</font></b>

<P align="left"><b>Votre deuxième équipe</b>
<table width="84%">
<tr>
<td>
<b>Votre équipe: </b>
<select id="eq2" name="eq2" onChange="selbte1('eq2',2)">
<option value="-1">????????????</option>
<option value="Détroit">Détroit</option>
<option value="Calgary">Calgary</option>
<option value="San Jose">San Jose</option>
</select></td>
<td id="match5_check"> </td>
</tr>
</table>
<HR>
<P align="center"><b><font color="#FF0000">VOTRE ÉQUIPE GAGNANTE</font></b>
<P align="left"><b>Choisir votre équipe gagnante de la coupe stanley</b>
<table width="84%">
<tr>
<td>
<b>Votre équipe:</b>
<select id="eq3" name="eq3">
<option value="-1">????????????</option>
<option value="bbbb">bbbb</option>
<option value="cccc">cccc</option>
</select></td>
<td id="eqp3_check"> </td>
</tr>
</table>
<P align="center">
<input type="button" name="eqp" value="Envoyer" disabled="disabled" >
</form>
</body>
</html>