Encodage URL dynamique avec des paramètres à valeurs multiples

Bonjour,


Je souhaiterais mettre en place une fonction javascript qui soit capable de redéfinir l'URL dynamiquement dans le cas des paramètres à valeurs multiples.

J'ai un formulaire dans lequel j'ai un select avec une sélection multiple de la forme suivante:

Code:

---

1 2 3 4 5 6 7 8 9 10 11

<form > <select name="state[]" multiple="multiple" size="5"> <option value="e0">e0</option> <option value="e1">e1</option> <option value="e2">e2</option> <option value="e3">e3</option> </select> <br/> <input type="submit" value="Test"/> </form>

---

Si je clique sur le bouton Test je retrouve dans mon URL la ligne suivante:

Code:

---

?state=e0&state=e1&state=e2&state=e3&...

---

Ce que je souhaite simplifier cette ligne de la façon suivante:

Code:

---

?state=e0,e1,e2,e3&...

---

Je sais comment récupérer le mon élément

Code:

---

document.getElementsByName("state");

---

Par contre je ne sais pas comment récupérer le tableau associé à cet élément et redéfinir l'URL dynamiquement une fois le formulaire validé.

Je suis novice en Javascript, j'espère que quelqu'un pourra m'apporter son aide.

Cordialement Lazarel ;)

Bonjour,
dans le cas d'une liste multiple, les différentes sélections sont envoyées au serveur, en POST, justement sous forme de liste séparée par des virgules.
Il suffit peut être juste de changer la méthode de ton form, non ?
(et peut être d'enlever les [] du name)

A+

tu pourrais ajouter les id à chaque champs option...

Code:

---

1 2 3 4 5 6 7 8 9 10 11

<form > <select name="state[]" multiple="multiple" size="5"> <option id="e0" value="e0">e0</option> <option id="e1" value="e1">e1</option> <option id="e2" value="e2">e2</option> <option id="e3" value="e3">e3</option> </select> <br/> <input type="submit" value="Test" onclick="alert(document.getElementById('e1').selected);"/> </form>

---

Citation:

---

Envoyé par E.Bzz

Bonjour,
dans le cas d'une liste multiple, les différentes sélections sont envoyées au serveur, en POST, justement sous forme de liste séparée par des virgules.
Il suffit peut être juste de changer la méthode de ton form, non ?
(et peut être d'enlever les [] du name)

A+

---

je pense qu'avec POST ou GET, la réponse transmise au serveur sera toujours par exemple de la form

Code:

---

1 2	...&state[]=e0&state[]=e3...

---

donc si tu veux récupérer tous les choix, il me semblerait que ce soit nécessaire d'utiliser un tableau

Citation:

---

Envoyé par htr999

je pense qu'avec POST ou GET, la réponse transmise au serveur sera toujours par exemple de la form

Code:

---

1 2	...&state[]=e0&state[]=e3...

---

donc si tu veux récupérer tous les choix, il me semblerait que ce soit nécessaire d'utiliser un tableau

---

Non (testé) !
Avec

Code:

---

<select name="state" multiple>

---

tu récupéreras "&state=e0,e3" par exemple.
Ce fonctionnement est peut être dû aux [], justement (mais j'utilise pas cette syntaxe, visiblement liée à PHP) ...

A+

ah ok au temps pour moi :)
j'ai peut-être l'habitude avec les form en php

Et bien,


Merci toutes ces réponses :D. En fait l'idée est de pouvoir modifier l'URL avant que celle-ci soit envoyée au serveur.

Dans mon cas, une fois le formulaire validé je fais appel à une servlet qui est chargée de me renvoyer un rendu html ou pdf pour faire du reporting avec BIRT.

Comme parfois les paramètres utilisés sont longs et peuvent prendre plusieurs valeurs l'URL devient vite illisible. Je souhaite donc simplifier cette URL au maximum pour avoir quelque chose de plus propre.

Peut être est ce plus clair maintenant ;)

Cordialement Lazarel ;)

Ben ... c'est plutôt moins clair :mrgreen:

Citation:

---

Envoyé par lazarel

Si je clique sur le bouton Test je retrouve dans mon URL la ligne suivante:

Code:

---

?state=e0&state=e1&state=e2&state=e3&...

---

Ce que je souhaite simplifier cette ligne de la façon suivante:

Code:

---

?state=e0,e1,e2,e3&...

---

---

La réponse est : si tu passes ton form en POST (cas par défaut), et que tu enlèves les crochets du name, tu auras ce résultat.
As-tu essayé ?

A+

Re,

Bon voilà j'ai suivi le conseil de E.Bzz et j'ai pu mettre au point ce que je souhaitais.

D'abord le form

Code:

---

1 2 3 4 5 6 7 8 9 10

<form id="myform" method="post" action="http://localhost/javascript/encodeURI.php"> <select id="state" name="state" multiple="multiple" size="5"> <option value="e0">e0</option> <option value="e1">e1</option> <option value="e2">e2</option> <option value="e3">e3</option> <option value="e4">e4</option> </select><br/> <input type="button" value="Test" onclick="myURI()"/>

---

Ensuite la fonction myURI()

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14

function myURI(){   var x = document.getElementById("myform"); var t = document.getElementById("state"); var tmp = new Array();   for (var i=0; i < t.length; ++i){ if (t.options[i].selected==true) tmp.push(t.options[i].text); } x.action += "?"+t.name+"="+tmp.join(","); x.submit(); }

---

Maintenant à la validation de mon formulaire j'ai l'URL suivante:

Code:

---

1 2	http://localhost/javascript/encodeURI.php?state=e0,e1,e4

---

Maintenant il me reste plus qu'à mettre en place une méthode générique lorsque que j'ai plusieurs champs :king:

Cordialement Lazarel ;)

:koi:

Tu as vérifié ce que tu récupères sur le serveur avec

Code:

---

1 2 3 4 5 6 7 8 9 10

<form id="myform" method="post" action="http://localhost/javascript/encodeURI.php"> <select id="state" name="state" multiple="multiple" size="5"> <option value="e0">e0</option> <option value="e1">e1</option> <option value="e2">e2</option> <option value="e3">e3</option> <option value="e4">e4</option> </select><br/> <input type="submit" value="Test"/> </form>

---

Parce que encore une fois, le résultat devrait être le même (sans JS, et donc quelque soit le nombre de <select> du form) ...

Loin de moi l'idée de vouloir insister :aie:

A+

Eh bien,


Tu as raison d'insister car le résultat est le même :aie:

J'avoue ne pas comprendre normalement la méthode POST est sensée caché les paramètres passés dans l'URL or ici ils sont visible :roll:

Bon c'est pas grave au moins j'aurais pu en apprendre un peu plus sur javascript 8-)

En tout cas merci E.Bzz

Cordialement Lazarel ;)