11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Voici mon problème. Considérons un lien du style :

http://mondomaine/page.php?action=123456

(c'est donc une page de script php à laquelle on passe un paramètre, ici de valeur "123456").

Ce que je voudrais c'est que l'utilisateur entre le paramètre dans un formulaire texte, par exemple avec...

<form name="form1">
<input type="text" name="param" id="param" value="">
<input type="button" value="Afficher" onclick="window.open('http://mondomaine/page.php?action=??????')">
</form>


... et ouvre le lien en cliquant sur le bouton.

Bien entendu, dans le formulaire ci-dessus j'ai remplacé la valeur saisie par l'utilisateur par des points d'interrogation, car c'est là que mes connaissances très limitées en JS trouvent leurs limites Smiley ohwell .

J'ai aussi tenté d'explorer la piste d'un onclick qui ouvre sur une fonction JS dans le HEAD, mais je ne suis pas arrivé à récupérer la valeur saisie dans le champ text, ni à la concaténer avec la première partie de l'url.

J'ai tenté ça (avec dans le formulaire ci-dessus onclick="affiche();") :

<script language="javascript">
function affiche() {
var adresse = document.forms["form1"].elements[0];
window.open('http://www.wikispot.fr/wikispot-e.php?display='+adresse)
}
</script>


Mais ça marche pas Smiley decu

Quelqu'un pour m'aider ? Merci d'avance.

Nota: pour vos essais, si vous arrivez à ouvrir une fenêtre du navigateur avec l'url complet (http://mondomaine/page.php?action=123456) dans la barre d'adresse ça m'ira. Le reste en php importe peu pour ce présent problème.
Modifié par dorjee (08 May 2007 - 19:46)
Pourquoi tiens-tu tant que ça à l'ouvrir dans une nouvelle fenêtre ?
Passe en transitional comme ça tu pourras utiliser target.
J'ai finalement trouvé la solution sur un forum anglais...

D'abord le formulaire et son bouton :

<input type="text" id="identification" size="40" value=""><br>
<input type="button" onclick="openlink()" value="Afficher">


Puis, la fonction openlink(), que l'on peut mettre dans HEAD ou dans le BODY :

<script language="JavaScript"><!-- ;
function openlink() {
var obj = document.getElementById("identification")
window.open('http://mondomaine/page.php?action='+obj.value+'');}
// --></script>


ainsi, la fonction openlink() récupère le paramètre d'identification saisi par l'utilisateur (par exemple : 123456) avec le "document.getElementById" et ouvre une fenêtre en concaténant l'URL de base "http://mondomaine/page.php?action=" au paramètre d'identification placé dans la variable "obj", afin que la fenêtre s'ouvre sur le lien complet :
"http://mondomaine/page.php?action=123456"

Pour une application concrète voir : http://www.wikispot.fr/
Regarder sous les drapeaux menu gauche.
return false... je veux bien, mais ça marche bien sans, alors à quoi ça sert ? A faire du code de puriste ? Smiley ravi

Voici mon script sur site, dans le HEAD :

<script language="JavaScript"><!-- ;
function openwikispot() {
var obj = document.getElementById("idwikispot")
window.open('http://www.wikispot.fr/wikispot.php?display='+obj.value+'');}
// --></script>


dans le BODY :

<input type="text" id="idwikispot" size="18" maxlength="50" value="45.190351,0.697656,2007.03.04,14.20"><br>
<a href="#null" onclick="openwikispot()" class="menu">Afficher</a>


peux-tu me dire où tu mets le return false (si tu peux écrire la ligne avec la bonne syntaxe que je ne me trompe pas...) merci.
en fin de fonction; Juste pour qu'il se passe au moins quelque-chose si je n'ai pas javascript.

Mais c'est un truc de puriste, ça Smiley cligne

<todo>ne plus essayer d'expliquer quelque-chose sur alsa, non vraiment, d'autres font ça très bien, et moi très mal, chacun son domaine, sorry.</>
Désolé pour le mot puriste (suivi d'une émoticon souriante tout de même), mais c'est parce que Google m'a entraîné sur quelques forums où ça discuté ferme de savoir qu'elle est l'utilité de return false.

En fait, pour des gens pas formés informatique (c'est mon cas), qui ne font qu'adapter des scripts à leur sauce, en piochant dans ce qui est déjà là, l'exemple est essentiel. Par exemple, au lieu de me dire "'return false'', nom de Zeus", comme si c'était une évidence et sans me dire ni à quoi ça sert, ni où le mettre, un truc du genre : "je te conseille de mettre "return false" à la fin de ta fonction comme ceci :

window.open('http://mondomaine/page.php?action='+obj.value+'');
return false;}
// --></script>


parce que ça va faire que si JS n'est pas opérationnel etc.

Donc, voilà, c'est très simple, expliquer c'est souvent donner l'exemple Smiley ravi
Mais un grand grand merci à tous les deux Smiley loveu
Hello,

Si j'ai bien compris le problème, il y a une solution beaucoup plus simple et accessible :
<form action="http://example.com/page.php" target="_blank">
	<p><input type="text" name="action" id="action" />

	<input type="submit" value="Afficher" /></p>
</form>

(avec un doctype transitionnel si l'on tient à ouvrir la page dans une nouvelle fenêtre et donc à garder l'attribut target).
Bravo Julien ! Une solution effectivement courte et efficace.

Le seul problème à présent est de pouvoir passer un complément de lien qui contient des virgules. En saisissant le paramètre : 45.190351,0.697656,2007.03.04,14.20, ta solution donne :

http://www.wikispot.fr/wikispot.php?action=45.190351%2C0.697656%2C2007.03.04%2C14.20

au lieu de :

http://www.wikispot.fr/wikispot.php?display=45.190351, 0.697656,2007.03.04,14.20

les virgules ayant été transformées en "%2C" un code hexadécimal je crois. Comme il n'est pas question que je reprenne tout mon système pour remplacer les virgules par autre chose, comment faire pour forcer, avec ta méthode, l'affichage des virgules dans le lien ?
En fait, le caractère "," est échappé car c'est un catactère spécial au sein d'une URL. Normalement, le code côté serveur devrait te le fournir de manière brute, en ayant remplacé les échappements par les caractères correspondants.

D'ailleurs, ça t'évite en passant quelques soucis : imagine que l'utilisateur entre "pouet&coin=tsoin", et que tu n'échappes pas les caractères. L'URL devient alors "http://www.wikispot.fr/wikispot.php?action=pouet&coin=tsoin", ce qui fait deux paramètres : "action=pouet" et "coin=tsoin".
Je ne comprends pas très bien, car j'avais justement adopté les virgules dans les url en vérifiant bien qu'elles n'étaient pas "échappées" comme tu dis. De fait une url comme ceci :

http://www.wikispot.fr/wikispot.php?display=45.190351,0.697656,2007.03.04,14.20

(((nota : ce p. Smiley fache d'éditeur de forum me met un espace après la première virgule, mais de quoi je me mèle, de fait y'a pas d'espace, bien entendu, copie-colle le lien et enlève l'espace si tu veux l'essayer !!!)

fonctionne très bien et l'url reste telle qu'elle est sous IE comme sous FF et le serveur ne me fait pas problème. Le paramètre est bien recueilli et traité par le script php pour afficher le bon wikispot, celui correspondant au paramètre.

Maintenant, si je rentre pour rire :

http://www.wikispot.fr/wikispot.php?display=45.190351,0.697656,2007.03.04,14.20&coin=tsoin

cela fait le même effet, car de toute façon php ne lit que le premier paramètre. Donc j'en suis à dire que toute élégante et simple que soit ta solution, elle ne marche pas pour le moment si on met des virgules dans l'url (j'ai essayé de les échapper avec un anti-slash, mais c'est pire, l'anti-slash est lui-même échappé - avec %5C). A mon avis, avec ta solution il doit y avoir quelque chose à faire que fait le passage par la variable "obj" de ma solution. Avec ta solution peut-on passer par l'intermédiaire d'une variable ?
Modifié par Julien Royer (09 May 2007 - 17:00)
dorjee a écrit :
(((nota : ce p. Smiley fache d'éditeur de forum me met un espace après la première virgule, mais de quoi je me mèle, de fait y'a pas d'espace, bien entendu, copie-colle le lien et enlève l'espace si tu veux l'essayer !!!)

Merci de rester poli. Smiley smile J'ai corrigé le problème. Si l'éditeur réagit comme ça, c'est justement parce que le caractère "," est un caractère spécial dans une URL.

En fait, je ne comprends pas ton problème. J'ai testé l'URL http://www.wikispot.fr/wikispot.php?display=45.190351%2C0.697656%2C2007.03.04%2C14.20 et ça semble bien marcher, non ?
Au pire, si tes caractères %## sont mal interprétés dans ton script serveur, tu peux passer à la moulinette urldecode. Théoriquement, tous les caractères non-ascii sont censé être encodés.
Oui, tu as raison, ça marche, donc TA solution élégante marche aussi. Précédemment le lien était faux, avec "?action=" au lieu de "?display=", c'est pour ça que ça marchait pas, autant pour moi.

J'ai analysé quelque peu ta solution, au final c'est ça :

<form action="http://www.wikispot.fr/wikispot.php" target="_blank">
<input type="text" name="display" size="40" value="45.190351,0.697656,2007.03.04,14.20">
<input type="submit" value="Afficher">
</form>


Le paramètre "45.190351,0.697656,2007.03.04,14.20" est pré-saisi pour faire vite. Je me rend donc compte que c'est le "name" du champ text du formulaire qui rajoute "?display=" et l'information contenue (et saisie) dans le champ du formulaire. C'est vraiment GENIAL Smiley clapclap . J'espère que ça pourra servir à d'autres.
Modifié par dorjee (09 May 2007 - 21:25)
Tant mieux. Smiley smile

Soit dit en passant, ce n'est pas vraiment génial, c'est juste une utilisation basique des possibilités offertes par HTML. Mais on a souvent tendance à chercher des solutions compliquées là où on pourrait faire très simple.