Liste déroulante avec lien avec autre page

Résolu/Fermé
mela - 11 janv. 2010 à 15:24
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 - 12 janv. 2010 à 13:09
Bonjour,

J'aimerai mettre sur mon site plusieurs listes déroulantes, dans chaque liste j'aimerai que lorsque l'on clique sur un choix, cela me dirige vers une autre page.

J'ai réussi à le faire avec ce code :

<script type="text/javascript">
window.onload = function() {
formulaire = document.getElementById('form_url');

formulaire.onsubmit = function() {
if(this.elements[0].value != "") {
document.location.href = this.elements[0].value;
}
};

formulaire.elements[0].onchange = function() {
if(this.value != "") {
document.location.href = this.value;
}
};
};
</script>

<form action="redirection.php" methode="post" id="form_url">
<p>
<label for="url">Menu :</label>
<select name="url" id="url">
<option value="">Choisissez :</option>
<option value="image/Documents/LettreFFJBT/n180.pdf">Accueil</option>
<option value="news.html">Les news</option>
<option value="contact.html">Nous contacter</option>
</select>

</p>
</form>


Mais quand je rajoute une seconde liste ça ne marche plus. Pourquoi?

Merci par avance pour vote aide.
A voir également:

5 réponses

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
11 janv. 2010 à 20:49
pas besoin de plusieurs fonctions, il suffit de passer la ref de la liste en argument à la fonction:

<script type="text/javascript">
function rediriger(id_liste){
	obj=document.getElementById(id_liste);
	if(obj.value !=""){
		document.location.href=obj.value;	
	}
}
</script> 
<form action="redirection.php" methode="post" id="form_url">
<p>
<label for="url">Menu :</label>
<select name="url1" id="url1" onChange="rediriger('url1');">
<option value="">Choisissez :</option>
<option value="image/Documents/LettreFFJBT/n180.pdf">Accueil</option>
<option value="news.html">Les news</option>
<option value="contact.html">Nous contacter</option>
</select>
<select name="url2" id="url2" onChange="rediriger('url2');">
<option value="">Choisissez :</option>
<option value="image/Documents/LettreFFJBT/blabla.pdf">blabla</option>
<option value="A.html">A</option>
<option value="B.html">B</option>
</select>

</p> 
1
ENORME!!! ça marche!! merci Alain
0
Encore merci Alain. Encore une petite question dans ma liste n°4 j'aimerai avoir une 2ème liste qui serait liée à la 1ère, comment je peux faire?

Merci.
0
Ozimandias Messages postés 502 Date d'inscription jeudi 14 mai 2009 Statut Membre Dernière intervention 10 mars 2010 46
11 janv. 2010 à 16:04
parce que avec : elements[0] tu prends uniquement la première liste déroulante c a d <select name="url" id="url"> ...

Si tu met plusieurs listes déroulantes il te faut soit plusieurs fonctions (une par liste) soit une boucle qui recense toute tes listes déroulantes.
0
MErci pour ta réponse. Je suis novice dans la programmation, est-ce que tu pourrais m'indiquer comment faire pour créer une boucle qui recense toutes mes listes. Merci
0
Ozimandias Messages postés 502 Date d'inscription jeudi 14 mai 2009 Statut Membre Dernière intervention 10 mars 2010 46
11 janv. 2010 à 16:43
A la place de :

formulaire.elements[0].onchange = function() {
if(this.value != "") {
document.location.href = this.value;
}
};


J'aurai fait un truc dans ce genre:

var selects = formulaire.getElementsByTagName('select');

for(x in selects){

x.onchange = function() {
if(this.value != "") {
document.location.href = this.value;
}
};

}

Il y a peut être des erreurs, je suis désolé mais je n'ai pas le temps de vérifier ce soir.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
12 janv. 2010 à 13:09
2 ième liste liée comment ?
si tu n'as pas beaucoup de valeurs deuxieme liste liées aux valeurs de la 1 ière tu peux les mettre dans des array javascript et le choix listappele javascript qui genere la 2 ième par l'array correspondant

sinon si c'est plius lours et si tes valeurs sont dans une bdd par exemple, et si tu ne veux pas recharger la page il faut passer par AJAX, c'est nettement plus compliqué
0