menu déroulant dynamique

**leclone** · 04/12/2007, 11h58

bonjou a tous,

j'ai un petit probleme avec mon nemu déroulant

voici tout d'abord le script javascript :

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
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
85
86
87
88
89
90
91
92
93
94
95
<SCRIPT LANGUAGE="JavaScript">
menu=new Array()

// Rajoutez un élément au tableau menu pour chaque categorie supplémentaire
// De la même façon, pensez à modifier le formulaire pour rajouter des categories.
menu[0]=new Array()
menu[1]=new Array()
menu[2]=new Array()
menu[3]=new Array()
menu[4]=new Array()
menu[5]=new Array()
menu[6]=new Array()
menu[7]=new Array()

// Modifiez ici les variables pour les menus deroulant
// la première valeur est le titre, la seconde l'url
// metter l'url à "null" si vous ne souhaitez pas une redirection pour ce titre

menu[0][0]=new Option("Sélectionnez l'activité","")
menu[0][1]=new Option("1-1 - Anticiper la dde et y répondre","")
menu[0][2]=new Option("1-2 - Fabriquer le SF","")
menu[0][3]=new Option("1-3 - Mettre à dispo le PF","")
menu[0][4]=new Option("1-4 - Mettre à disp un PF ss-tté","")
menu[0][5]=new Option("1-5 - Prendre la cde du client et livrer","")

menu[1][0]=new Option("Sélectionnez l'activité","")
menu[1][1]=new Option("2-1 - Identif. piste de dévpt (Innovation)","")
menu[1][2]=new Option("2-2 - Assurer le dévpt pdt","")
menu[1][3]=new Option("2-3 - Dévpt pdt. industrialisation","")
menu[1][4]=new Option("2-4 - Développer un PF à l'ext","")
menu[1][5]=new Option("2-5 - Développer un conditionnement","")
menu[1][6]=new Option("2-6 - Lancement cial nveau pdt","")

menu[2][0]=new Option("Sélectionnez l'activité","")
menu[2][1]=new Option("3-1 - Planifier un arrêt/modif. pdt","")
menu[2][2]=new Option("3-2 - Gérer un arrêt de produit","") 
menu[2][3]=new Option("3-3 - Gérer un chgt de pdt","") 
                    
menu[3][0]=new Option("Sélectionnez l'activité", "")
menu[3][1]=new Option("4-1 - Accroître le rayonnement de SD", "")
menu[3][2]=new Option("4-2 - Convaincre de nouveaux partenaires", "")
menu[3][3]=new Option("4-3 - Apporter un plus à nos partenaires", "")
menu[3][4]=new Option("4-4 - Nos partenaires nous apportent un  plus", "")
menu[3][5]=new Option("4-5 - Remontées de nos partenaires", "")

menu[4][0]=new Option("Sélectionnez l'activité", "")
menu[4][1]=new Option("5-1 - Sécurité/CHSCT", "")
menu[4][2]=new Option("5-2 - Disposer et Optim. les RM", "")
menu[4][3]=new Option("5-3 - Faire grandir l'ent. et ses salariés", "")
menu[4][4]=new Option("5-4 - SD acteur resp. dans son envirronnement", "")

menu[5][0]=new Option("Sélectionnez l'activité","")
menu[5][1]=new Option("6-1 - Disposer d'info. de base correctes","")
menu[5][2]=new Option("6-2 - Développer et entretenir un SI fiable","")
menu[5][3]=new Option("6-3 - Mettre à dispo. des infos. pertinentes","")
menu[5][4]=new Option("6-4 - Exigences légales : compta/paye...","")

menu[6][0]=new Option("Pas d'activité !!!", "")

menu[7][0]=new Option("Pas d'activité !!!", "")

// Ne rien modifié sous cette ligne
function changeSousTheme(numeroMenu){
	for (i=document.menuDeroulant.sousTheme.options.length-1;i>0;i--){
		document.menuDeroulant.sousTheme.options[i]=null
		}
		
	for (i=0;i<menu[numeroMenu].length;i++){
		document.menuDeroulant.sousTheme.options[i]=new Option(menu[numeroMenu][i].text,menu[numeroMenu][i].value)
		}
		
	document.menuDeroulant.sousTheme.selectedIndex=0
	}

function selectmenu(theme_prin){
	if (theme_prin.theme.options[theme_prin.theme.selectedIndex].value == "null"){
		alert('selectionnez d\'abord un theme');
		}
	else{
		window.top.location.href = theme_prin.theme.options[theme_prin.theme.selectedIndex].value;
		}
	}

function destination(){
	var destination = document.menuDeroulant.sousTheme.options[document.menuDeroulant.sousTheme.selectedIndex].value;

	if(destination=="null"){
		alert('Veuillez saisir une destination valide!');
	}
	else{
		window.top.location.href = destination;
		}
	}

</SCRIPT>

voici le codage :

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
<div align="center">
 
    <SELECT NAME="theme" SIZE=1 onChange="selectmenu(this.form)">
      <OPTION selected VALUE="null">Sélectionnez le processus :
      <OPTION VALUE="Javascript:changeSousTheme(0)">1-0 - Assurer la dispo. des pdts (C. Gantois, L. Didelot)
      <OPTION VALUE="Javascript:changeSousTheme(1)">2-0 - Lancer un nveau pdt (S. Merveilleux, A. De Saint Triver) 
      <OPTION VALUE="Javascript:changeSousTheme(2)">3-0 - Modif./arrêter un pdt (ML. Trameson) 
      <OPTION VALUE="Javascript:changeSousTheme(3)">4-0 - Se développer (partenaires) (C. Bassez, A. De Saint Trivier) 
      <OPTION VALUE="Javascript:changeSousTheme(4)">5-0 - Dévpt les RH et RM (M. Lecoq, A. Assoignon)
      <OPTION VALUE="Javascript:changeSousTheme(5)">6-0 - Gérer/Mettre à dispo. des infos (G. Quennesson)
      <OPTION VALUE="Javascript:changeSousTheme(6)">7-0 - Amélioration Continue (MH. Bailleux)
      <OPTION VALUE="Javascript:changeSousTheme(7)">8-0 - Stratégie (R. Blanchard)
    </SELECT>
 
    <SELECT NAME="sousTheme" style="width:300">
      <OPTION VALUE="null">Sélectionnez d'abord un processus 
    </SELECT>
 
    <INPUT TYPE=button onclick="destination()" VALUE="Valider">
  </div>

Quand je veux sélectionner quelque chose dans le premier menu déroulant, il ne veux rien mettre dans le deuxieme menu déroulant, il ne dit qu'il y a une erreur (voir ligne en rouge dans le script)
voici l'erreur :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.menuDeroulant.sousTheme a la valeur Null ou n'est pas un objet

je n'arrive pas a resoudre ce probleme
est ce que quelqu'un peut-il m'aider
merci d'avance
salutations.

**jln13** · 04/12/2007, 12h15

Salut,

tu as oublié de mettre une balise <form> autour des champs de ton formulaire !

**jln13** · 04/12/2007, 12h23

Et aussi tu dois changer ta fonction changeSousTheme car tu fais appel a document.menuDeroulant alors que rien ne s'appelle menuDeroulant !

Pour ce faire, utilise plutot des id au lieu de name dans tes select

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<SELECT id="theme" SIZE="1" onChange="selectmenu(this.form)">
<SELECT id="sousTheme" style="width:300">

puis change ta fonction en :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
function changeSousTheme(numeroMenu){
	for (i=document.getElementById("sousTheme").options.length-1;i>0;i--){
		document.getElementById("sousTheme").options[i]=null
	}
	for (i=0;i<menu[numeroMenu].length;i++){
		document.getElementById("sousTheme").options[i]=new Option(menu[numeroMenu][i].text,menu[numeroMenu][i].value)
	}
	document.getElementById("sousTheme").selectedIndex=0
}

voili voilou ..

**leclone** · 04/12/2007, 12h39

ok, ça fonctionne
merci beaucoup jln13
bonne apres midi
ciao

menu déroulant dynamique

JavaScript

Discussions similaires

Partager

Partager