Listes déroulantes OnChange

Bonjour tout le monde,

J'ai un soucis avec mes listes déroulantes, je m'explique :
J'ai créé l'évènement OnChange qui nous redirige sur une nouvelle page lors d'un changement et j'aimerais que sur cette nouvelle page, le même menu déroulant ait l'attribut choisi en "selected"
Par exemple si sélectionne "mer", on arrive sur une nouvelle page qui contient le même menu déroulant avec comme valeur d'affichage : "mer".

Contraintes (Parce que ce serait trop facile :( ) :

Je travaille sur WordPress et j'utilise le plugin FlowFlow que je ne maîtrise pas complètement.
Ce menu déroulant est créé depuis un fichier JavaScript de la façon suivante.

Code:

---

1 2 3 4 5 6 7

r+= " <div class=\"menuSW\" style=\"float:left;margin-left:30%;color:#808080;background-color:#e1e1e1\"> <form name=\"form1\" action=\"\" method=\"post\" > <select name=\"testListe\" id=\"testListe\" onchange=\" document.location=this.value; \"> <option> Centres d'intérêts </option > <option value=\"/Mer\" > Mer </option>\" </select> </form> </div>"

---

J'ai essayé ceci mais si j'ai bien compris, il est impossible d'utiliser du PHP dans un fichier JS sans passer par AJAX :

Code:

---

"<option value=\"/Mer\" <?php if( isset($choix) && $choix==\"/mer\" ) echo(\"SELECTED\" ); ?>> Mer </option>"

---

J'ai essayé de bidouiller de la façon suivante :

Code:

---

1 2 3

document.getElementById('testListe').selectedIndex = 2; document.getElementsById("testListe").selected = "selected"; document.getElementById("testListe" ).options[3].selected=true;

---

J'ai essayé plusieurs autres méthodes qui ont toutes échouées.

De l'aide serait la bienvenue. Si je n'ai pas été clair ou s'il manque des informations, je surveille ce post :D

L'information de l'attribut sélectionné doit se trouver quelque-part dans l'URL pour être transmise d'une page à une autre. C'est ça ou bien un stockage local d'informations, via un cookie ou le localStorage par exemple. Qu'est-ce que tu choisis ?

Je stocke la valeur contenue dans l'URL, oui.

Si par exemple je suis sur l'URL http://monSite/monAdresse/ et que je choisi "mer" depuis le menu déroulant, j'arrive sur l'url http://monSite/monAdresse/mer

Je peux donc récupérer cette valeur avec le pathname. Maintenant je n'arrive pas à l'utiliser

Pour récupérer le dernier bout de chemin dans l'URL :

Code:

---

var path = window.location.pathname.split('/').pop();

---

Si par exemple path == "mer", tu peux sélectionner l'option value="mer" simplement comme ça:

Code:

---

document.getElementById("testliste").value = path;

---

Je ne sais pas comment est-ce que cela fonctionne, voici mon adresse : http://feeds.mydistrikt.com/distrikt-feed-bretagne/mer/

Et le code suivant ne m'affiche absolument rien

Code:

---

1 2	var path = window.location.pathname.split('/').pop(); alert (path);

---

J'ai quand même essayé
ceci

Code:

---

document.getElementById("testListe").value = path;

---

Puis directement

Code:

---

document.getElementById("testListe").value = "Mer";

---

ou

Code:

---

document.getElementById("testListe").value = "mer";

---

Mais une fois que j'utilise ce code, le JavaScript ne fonctionne plus (Comme si il y avait une erreur de synthaxe)

Vous n'aviez pas précisé le / derrière mer dans votre message précédent. Du coup le dernier bout après le / est une chaîne vide.

Vous pouvez récupérer l'avant dernier comme ceci :

Code:

---

window.location.pathname.split('/').slice(-2)[0]

---

Bonjour Sylvain,

Tout d'abord, je vous remercie de chercher à m'aider !

Cependant ce n'est pas pour récupérer le paramètre dans l'URL que j'ai besoin d'aide car je le fais de cette façon :

Code:

---

1 2	var pathArray = window.location.pathname.split( '/' ); var secondLevelLocation = pathArray[2];

---

Là ou je bloque c'est pour choisir une option en "selected" sur mon menu déroulant.

Je n'arrive même pas à sélectionner une des options à l'aide du langage JS de la façon suivante.

Code:

---

document.getElementById("testListe").value = "mer";

---

Une fois que je rajoute ce code, le code JS ne s'exécute plus

Vous avez une erreur en console ? Vous exécutez bien ce code après que l'élément soit déclaré dans le HTML ?

Pour rappel, ce code html est déclarer depuis le JS. Cela pose peut-être un problème.

A la fin de mon fichier JS, j'ai ce code :

Code:

---

window.FlowFlow=l.init()}(jQuery);

---

Donc j'imagine que c'est à ce moment là qu'on soumet les informations à notre page.

Si je place

Code:

---

document.getElementById("testListe").value = "Mer";

---

Avant : Erreur de console
Après : Rien ne se passe. (Je pense que j'ai la même erreur mais que à cet endroit, ça n'empêche pas le reste du code de s'exécuter.)

C'est bien de savoir qu'il y a une erreur en console, ça aurait été encore mieux de savoir laquelle...

Je suis presque sûr que le problème vient du fait que vous modifiez l'élément avant qu'il soit ajouté au DOM, d'où une erreur de référence à null. Il suffit d'exécuter ce code APRES l'ajout au DOM (sans doute un innerHTML quelque part après votre code en "r+=" posté en premier post)

Oui c'est exact l'élément n'existe pas. Pourtant je tente de modifier sa valeur à la toute fin du fichier JS...

J'ai fais une recherche dans le fichier puis dans tout les fichiers du plugin il n'y a pas de r.innerHTML