Menu déroulant, quelques soucis

**yuyu599** · 31/03/2008, 17h09

Bonjour a vous.
Voila ce que je veux faire:
Creer un menu déroulant, qui en selectionnant un des éléments de ce menu m'ouvre un menu déroulant correspondant.
Puis en cliquant sur un des éléments du 2eme menu déroulant qu'il m'ouvre une page correspondante.

j'espere etre a peu pres clair;
Voici mon script:

Code :

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
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
<script language="Javascript" type="text/javascript" > 
function choix(formulaire) 
{ 
var j; 
var i = formulaire.boite1.selectedIndex; 
if (i == 0) 
for(j = 1; j <6; j++) 
formulaire.boite2.options[j].text=""; 
 
 
else{ 
switch (i){ 
case 1 : var text = new Array( "T1","T2","T3","T4","T5"); 
break; 
case 2 : var text = new Array("S1","S2","S3"); 
break; 
 
case 3 : var text = new Array("R1","R2","R3","R4","R5","R6"); 
break; 
case 4 : var text = new Array("L1"); 
break;
case 5 : var text = new Array("P1","P2"); 
break;
} 
 
for(j = 0; j<6; j++) 
formulaire.boite2.options[j+1].text=text[j]; 
} 
formulaire.boite2.selectedIndex=0; 
} 
</script> 
</head> 
<body> 
<form name="formulaire">
<select name="boite1" onchange="choix(this.form)">
  <option selected>...........Choisissez une rubrique...........</option>
  <option>TTT</option>
  <option>SSS</option>
  <option>RRR</option>
  <option>LLL</option>
  <option>PPP</option>
</select>
<select name="boite2"> 
<option selected>...........Choisissez une rubrique...........</option> 
<option></option> 
<option></option> 
<option></option> 
<option></option> 
<option></option> 
<option></option> 
</form> 
</select> 
</body> 
</html>
<body>
</body>
</html>

Voila, 2 problemes ce pose :-(
Le premier est que quand on a pas 6 éléments dans le 2eme menu on obtient " Undefine" :-(
ET 2eme point, je voudrais que quand on click sur un des éléments du 2eme menu on accede a une page défini.

Voila si vous pouvier m'aider j'en serais ravi :-)

**yuyu599** · 31/03/2008, 20h30

Bon je vient de modifier mon code sa donne cela :

Code :

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
<FORM>
<SELECT NAME="liste1" SIZE="1">
<OPTION SELECTED VALUE="">-------- Sélectionnez--------
<OPTION VALUE="1.html">1
<OPTION VALUE="2.html">2
<OPTION VALUE="3.html">3
<OPTION VALUE="4.html">4
<OPTION VALUE="5.html">5
<OPTION VALUE="6.html">6
<OPTION VALUE="7.html">7
<OPTION VALUE="8.html">8
</SELECT>
<INPUT TYPE="button" VALUE="Validez"
  onClick="if (form.liste1.selectedIndex != 0)
      location = form.liste1.options[form.liste1.selectedIndex].value;
    else
      alert('Veuillez faire un choix dans le menu.')">
</FORM>

mais le probleme est le suivant :
J'aimerais qu'une fois que le visiteur est choisit un des éléments du menu, il soit envoyer directement sur la page correspondante, sans devoir clicker sur le bouton Validez.
Comment faire svp ^^

**SpaceFrog** · 31/03/2008, 20h38

un petite recherche avec "validation formulaire" sur le forum ou une petite consultation des contributions du forum ???

**Auteur** · 31/03/2008, 21h21

comme ceci ?

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
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
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
function choix(boite)
{
var j, n;
var i = boite.selectedIndex;
var boite2 = document.getElementById("boite2");
var tab = null, liens = null;
 
n = boite2.options.length;
for(j = 1; j <n; j++)
    boite2.remove(1);
 
 
if (i == 0)
{
    return;
}
else
{
 
    switch (i)
    {
        case 1 : tab = new Array("T1","T2","T3","T4","T5");
                 liens = new Array("T1.htm","T2.htm","T3.htm","T4.htm","T5.htm");
                break;
        case 2 : tab = new Array("S1","S2","S3");
                liens = new Array("S1.htm","S2.htm","S3.htm");
                break;
        case 3 : tab = new Array("R1","R2","R3","R4","R5","R6");
                liens = new Array("R1.htm","R2.htm","R3.htm","R4.htm","R5.htm","R6.htm");
                break;
        case 4 : tab = new Array("L1");
                 liens = new Array("L1.htm")
                break;
        case 5 : tab = new Array("P1","P2");
                 liens = new Array("P1.htm","P2.htm");
                break;
    }
 
    for(j = 0; j<tab.length; j++)
        boite2.options.add(new Option(tab[j], liens[j], false, false));
}
 
    boite2.selectedIndex=0;
}
 
function ouvrepage(boite)
{
    if (boite.selectedIndex!=0)
    {
        document.location.href = boite.value;
    }
 
}
//-->
</script>
</head>
 
<body>
<form id="formulaire">
 
<select id="boite1" onchange="choix(this)">
  <option selected="selected">...........Choisissez une rubrique...........</option>
  <option>TTT</option>
  <option>SSS</option>
  <option>RRR</option>
  <option>LLL</option>
  <option>PPP</option>
</select>
 
<select id="boite2" onchange="ouvrepage(this)">
  <option selected="selected">...........Choisissez une rubrique...........</option>
</select>
 
</form>
 
</body>
</html>

**yuyu599** · 31/03/2008, 22h17

merci beaucoup !!!!!!!
désolé j'avais recherché mais apparemment mal ^^
En tous cas big merci a vous je vous adore :-)

Menu déroulant, quelques soucis

JavaScript

Discussions similaires

Partager

Partager