Comment attribuer un lien à une liste déroulante liée ? [Débutant(e)]

**matgk26** · 29/08/2006, 11h23

Bonjrou à tous.

Tout d'abord je tiens à m'excuser de ma noobitude, je suis ultra débutant en la matière...J'ai effectué une recherche sur le forum et la FAQ mais je n'ai pas trouvé mon bonheur (peut etre ai-je mal cherché).

Je vous expose mon problème :
Grace à mes faibles connaissances en JS et à beaucoup de recherches sur le net et tests, j'ai réussi à mettre en place deux listes déroulantes liées (whaouuuu l'exploit).

Ma 2ieme liste est donc bien évidemment liée au choix fait dans ma 1ère. Je souhaite maintenant que lorsque un choix est sélectionné dans la deuxième liste, ce dernier entraine automatiquement une redirection vers une nouvelle page.

Concrettement ma 1ere liste propose de choisir son pays, ma deuxième une région au sein du pays précédemment choisis et je veux que lorsque par exemple quelqu'un a choisis France>>>Aquitaine, une nouvelle page s'ouvre automatiquement avec une liste de magasins en Aquitaine (page aquitaine.html).

Voici mon code actuel :

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
<head><SCRIPT language="JavaScript">
<!--
function Choix(form) {
i = form.pays.selectedIndex;
form.dep.options.length=0;
 Item = new Option("Choose your region", "", false, false);
 form.dep.options[0]=Item;
form.dep.selectedIndex = 0;
switch (i) {
case 1 : var txt = new Array ('04 - Alpes de Haute Provence ','05 - Hautes Alpes','06 - Alpes Maritimes','09 – Ariège','13 - Bouches du Rhône','17 - Charente Maritime','29 - Finistère','30 – Gard','31 - Haute Garonne','33 - Gironde','34 - Hérault','38 – Isère','40 - Landes','44 - Loire Atlantique','56 - Morbihan','64 - Pyrénées Atlantiques','65 - Hautes Pyrénées','66 - Pyrénées Orientales','69 – Rhône','73 - Savoie','74 - Haute Savoie','83 - Var','85 - Vendée'); break;
case 2 : var txt = new Array ('Champery','Château d’Oex','Crans Montana','Haute Nendaz','Les Crozets','Les Diablerets','Leysin','Morgins','Verbier','Rougemont','Torgon','Villars sur Ollon ','Zermatt'); break;
}
 
for (i=0;i<txt.length;i++) {
  Item = new Option(txt[i], "4.html", false, false);
  form.dep.options[i+1]=Item;
  }
} 
// -->
</SCRIPT>
</head>
<body>
<FORM>
	<SELECT NAME="pays" onChange='Choix(this.form)'>
	   	<OPTION>--- Choose your country ---</OPTION>
	   	<OPTION>France</OPTION>
	   	<OPTION>Switzerland</OPTION>
	</SELECT>
 
	<SELECT NAME="dep">
	   	<OPTION>--- Choose your region ---</OPTION>
	</SELECT>
 
</FORM>

Si vous pouviez m'éclairer (en termes simples ^^) sur la marche à suivre...

Merci d'avance.

**ze veritable farf** · 29/08/2006, 14h35

Salut

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
<head><SCRIPT language="JavaScript">
<!--
function Choix(form) {
i = form.pays.selectedIndex;
form.dep.options.length=0;
 Item = new Option("Choose your region", "", false, false);
 form.dep.options[0]=Item;
form.dep.selectedIndex = 0;
switch (i) {
case 1 : var txt = new Array ('04 - Alpes de Haute Provence ','05 - Hautes Alpes','06 - Alpes Maritimes','09 – Ariège','13 - Bouches du Rhône','17 - Charente Maritime','29 - Finistère','30 – Gard','31 - Haute Garonne','33 - Gironde','34 - Hérault','38 – Isère','40 - Landes','44 - Loire Atlantique','56 - Morbihan','64 - Pyrénées Atlantiques','65 - Hautes Pyrénées','66 - Pyrénées Orientales','69 – Rhône','73 - Savoie','74 - Haute Savoie','83 - Var','85 - Vendée'); break;
case 2 : var txt = new Array ('Champery','Château d’Oex','Crans Montana','Haute Nendaz','Les Crozets','Les Diablerets','Leysin','Morgins','Verbier','Rougemont','Torgon','Villars sur Ollon ','Zermatt'); break;
}
 
for (i=0;i<txt.length;i++) {
  Item = new Option(txt[i], "4.html", false, false);
  form.dep.options[i+1]=Item;
  }
} 
// -->
</SCRIPT>
</head>
<body>
<FORM ACTION="liste_magasins.html">
	<SELECT NAME="pays" onChange='Choix(this.form)'>
	   	<OPTION>--- Choose your country ---</OPTION>
	   	<OPTION>France</OPTION>
	   	<OPTION>Switzerland</OPTION>
	</SELECT>
 
	<SELECT NAME="dep">
	   	<OPTION>--- Choose your region ---</OPTION>
	</SELECT>
<INPUT TYPE="submit" VALUE="Envoyer" />
</FORM>

Je ne suis pas expert en Javascript mais pourquoi n'envoies tu pas ton formulaire via un bouton et en fonction de la région sélectionnée n'affiche tu pas la liste de tes magasins grâce à un petit test dans ta deuxième page ? (bien entendu, cette dernière doit contenir un peu de PHP, JSP ou autre pour pouvoir tester la région sélectionnée).

Mais c'est à mon avis la solution la plus simple.

**matgk26** · 29/08/2006, 16h07

C'est effectivement la solution vers laquelle je vais me diriger si je ne trouve pas mon bonheur.

Mais c'est tout de même moins ergonomique et moins esthétique d'avoir un bouton "envoyer" pour le site que je suis en train de mettre sur pied...un redirection automatique au choix de la liste 2 serait une solution bien meilleure (quoi que moins simple je te l'accorde).

Comment attribuer un lien à une liste déroulante liée ? [Débutant(e)]

JavaScript

Discussions similaires

Partager

Partager