Bonjour,
Voici mon problème. J'ai deux liste déroulante liées entre elles. C'est à dire que suivant la réponse qu'on choisi dans la première liste, la seconde liste est différente.
J'aimerai que la première liste déroulante se transforme en des cases d'option comme dans le code ci-dessous.

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
 
<form action="input_radio.htm">
<input type="radio" name="mode_paiement" value="Mastercard"> Mastercard<br>
<input type="radio" name="mode_paiement" value="Visa"> Visa<br>
<input type="radio" name="mode_paiement" value="AmericanExpress"> American Express
</form>

Je recherche à modifier La liste déroulante contenant "art musical" et "art visuel" afin qu'il soit comme celle dans l'exemple ci-dessous.
Attention, je souhaite toujours conserver le lien entre mes deux listes.
Voici mon code complet :

Code JavaScript : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
function changer_liste(list) {
var index = list.selectedIndex;
var i;
var sublist;
for (i = 0; i < list.length; i++) {
sublist = document.getElementById(list.options[i].value);
sublist.style.display = (i==index)?'block':'none';
}
}

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
<body onload="document.form.liste.onchange();">
<form name="form">
<select name="liste" onchange="changer_liste(this);">
<option value="musique">art musical</option>
<option value="visuel">art visuel</option>
</select>
 
<select id="musique" name="art_musical">
<option value="1">musique classique</option>
<option value="2">musique pop_rock</option>
</select>
 
<select id="visuel" name="art_visuel">
<option value="1">visuel exposition</option>
<option value="2" selected>visuel achat_location</option>
<option value="3">visuel performance</option>
</select>

Merci !