Cacher des champs de formulaire au chargement
Bonjour à tous,
je débute en JavaScript, ne m'en voulez pas trop si ma question est bête ;)
Je voudrais afficher différentes listes déroulantes en fonction du bouton radio qui est sélectionné. J'ai réussi a faire une fonction qui fait ça, mais le problème c'est qu'au chargement de la page, toutes les listes déroulantes sont affichées... Comment faire?
Voici mon 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
|
<html>
<head>
<script language="Javascript">
function GereControle(radio) {
for (var i=0; i<radio.length;i++) {
l = "liste_"+i;
var objControle = document.getElementById(l);
if (radio[i].checked) {
objControle.style.visibility = 'visible';
}
else{
objControle.style.visibility = 'hidden';
}
}
}
</script>
</head>
<form>
<br /><br />
<input type="radio" id="radio_10" name="test" onClick="GereControle(this.form.test);" > <label for="radio_10">Active de "liste_10"</label>
<br />
<input type="radio" id="radio_20" name="test" onClick="GereControle(this.form.test); "> <label for="radio_20">Active liste de "liste_20"</label>
<br/>
<input type="radio" id="radio_30" name="test" onClick="GereControle(this.form.test);" > <label for="radio_30">Active de "liste_30"</label>
<br />
<select id="liste_0">
<option value="1">Ligne 1</option>
<option value="2">Ligne 2</option>
<option value="3">Ligne 3</option>
</select>
<select id="liste_1">
<option value="1">Ligne 1</option>
<option value="2">Ligne 2</option>
<option value="3">Ligne 3</option>
</select>
<select id="liste_2">
<option value="1">Ligne 1</option>
<option value="2">Ligne 2</option>
<option value="3">Ligne 3</option>
</select>
</form>
</body>
</html> |
Merci d'avance!