formulaire: Y-a-t-il un pro dans la salle?

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

formulaire: Y-a-t-il un pro dans la salle?

Message par castafiore »

Bonjour,

Je ne suis qu'un piètre débutant et j'aurais besoin de l'aide d'un "pro"

Voici mon problème:

Je suis en train de créer un jeu sur mes pages perso qui consiste en des devinettes qu'il faut trouver pour progresser de page en page.

Ce que j'aimerais, c'est créer des formulaires comprenant une zone de texte + bouton ENVOI dans lesquels le texte tapé renvoie à une page bien précise.

Je m'explique:

Si la réponse correcte à la devinette n°1 (sur la page baptisée: devinette1.htm) est: paris, j'aimerais que le clic sur le bouton du formulaire renvoie à la page: http://perso.orange.fr/castafiore/paris.htm

Ce qui permettrait de progresser ainsi de page en page si, et uniquement si, la réponse est correcte.
AUTRE POINT TRES IMPORTANT : il ne faudrait pas que la réponse correcte apparaisse dans le code source de la page (paris, dans cet exemple) sinon la triche serait évidemment trop facile :?

J'ai tenté celui-ci (récupéré sur un site)

<script language="javascript">
<!--
function test() {
var Lien = (forms.formulaire.reponse); var Status = open(Lien,"_self"); }
// End -->
</script></p>
<form name="formulaire">
<div align="center"><input name="reponse"
size="50"><input value="envoi" onclick="test()"
type="submit"></div>
<script language="javascript"><!--
// --></script>


Mais le problème, c'est que le clic sur le bouton renvoie à cette adresse:
http://perso.orange.fr/castafiore/[b]de ... onse=paris[/b]

Ce serait parfait si je pouvais créer une page sous le nom de: devinette1?reponse=paris.htm mais le signe "?", n'étant pas accepté par windows en tant que nom de fichier, ça ne marche pas :(

Quel script utiliser, à votre avis, si toutefois, c'est faisable?

Merci :wink:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9
Benoit
Administrateur
Messages : 4894
Inscription : 19 juil. 2003, 10:59

Message par Benoit »

Le script que tu as mis là ne vérifie pas si la réponse est correcte. Si tu veux que ça fonctionne il va falloir utiliser un script de vérification côté serveur (probablement en PHP).

Techniquement, ça doit également être possible en JavaScript en utilisant XmlHttpRequest et en testant les codes de réponse HTTP (404 si la page n'existe pas) mais ça me semble bien compliqué, surtout que perso.orange.fr semble faire une redirection à la place.
♫ Li tens s'en veit, je n'ai riens fais ;
Li tens revient, je ne fais riens. ♪
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Je confirme qu'il est difficile de faire des redirections en fonction des codes de réponse http sur les serveurs orange.
De plus le php n'y est pas possible sauf en version payante.
ça s'annonce difficile pour ton projet.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; [eburo v1.3]; .NET CLR 1.1.4322)
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

Message par castafiore »

Merci à tous deux pour vos réponses :)

J'ai fini par trouver en tâtonnant :roll: ce qui ne fonctionnait pas dans ce script avec perso.orange.fr : il suffisait d'ajouter value à la suite de reponse, ce qui donne le script suivant:

<script language="javascript">
function test() {
var LienSuivant = (document.forms.formulaire.reponse.value); var Status = open(LienSuivant, "_self", ""); }
// End -->
</script>


Mais j'ai encore une petite question, s'il vous plait: dans le formulaire, une fois le texte entré, seul le bouton "envoyer" lance le script "test" ; l'appui sur la touche ENTER sur le clavier ne le lance pas :cry:

Quelle solution, à votre avis?

P.S. voici comment j'ai rédigé la form

<form name="formulaire"> <div
align="center"><input name="reponse" size="40"
type="text"><input value="Envoyer" onclick="test()"
type="button"></div></form>

Pourrait-on ajouter la fonction submit à la fonction onclick? Et, si oui, de quelle manière?

Merci


Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

castafiore a écrit :Pourrait-on ajouter la fonction submit à la fonction onclick? Et, si oui, de quelle manière?
Tu n'es pas le premier à te poser la question :)
http://openweb.eu.org/articles/validation_formulaire/

Un onsubmit sur le <form>, et supprime le onclick (plus généralement, évite les onclick, même sur les liens, car tout le monde ne clique pas sur les liens :wink: )

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.1) Gecko/20061208 Firefox/2.0.0.1
Invité

Message par Invité »

Merci beaucoup pour ta réponse, Calimo

Malheureusement, ça ne fonctionne pas si je remplace onclick par onsubmit (pareil si j'écris les deux à la suite, d'ailleurs).

Avec onsubmit, quand je tape sur enter, ça me renvoie sur ce lien :
http://perso.orange.fr/castafiore/essai ... se=energy2

Par contre, si je laisse onclick et que je clique : la page en question est celle-ci http://perso.orange.fr/castafiore/essai1 et la bonne réponse à entrer est : energy2 : là, ça marche.

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Media Center PC 3.0; .NET CLR 1.0.3705; .NET CLR 2.0.50727)
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Est-ce que tu as bien pensé à ajouter le "return false" ? Sinon c'est normal que ça ne fonctionne pas.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 6.0; fr; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

Message par castafiore »

Merci pour ta réponse, SB

D'accord pour ajouter "return false" mais à quel endroit faudrait-il l'insérer, d'après toi?

Voici ce que donne SCRIPT et FORM où j'ai remplacé onclick="test()" par onsubmit="test ()"

<script language="javascript">
<!--
function test() {
var LienSuivant = (document.forms.formulaire.reponse.value); var Status = open(LienSuivant, "_self", ""); }
// End -->
</script></p><form name="formulaire"> <div
align="center"><input name="reponse" size="40"
input="value=" type=" text="><input value="Envoyer"
onsubmit="test()"type="button"></div></form>



Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

Non, ce que tu soumets (onsubmit) c'est le <form>, pas le bouton <input>. Le onsubmit doit donc s'y appliquer :wink:

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.1) Gecko/20061208 Firefox/2.0.0.1
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

Message par castafiore »

Merci Calimo

Je ne sais pas si c'est ceci que tu veux dire:

<script language="javascript">
<script language="javascript"><!--
function test() {
var LienSuivant = (document.forms.formulaire.reponse.value); var Status = open(LienSuivant, "_self", ""); }
// End -->
</script></p><form name="formulaire"> <div
align="center"><input name="reponse" size="40"
onsubmit="test()" type="text"><input
value="Envoyer" onclick="test()" type="button">

Je précise tout de suite, je l'ai testé mais ça ne fonctionne pas... :cry:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Message par calimo »

J'ai dit que tu dois l'appliquer sur le <form>, c'est pas si compliqué que ça non ? :roll:

Code : Tout sélectionner

<script language="javascript">
<script language="javascript"><!--
function test() {
var LienSuivant = (document.forms.formulaire.reponse.value); var Status = open(LienSuivant, "_self", ""); }
// End -->
</script></p><form name="formulaire" onsubmit="test()"> <div
 align="center"><input name="reponse" size="40" type="text"><input
 value="Envoyer" type="button">
PS: mets tes code dans des balises

Code : Tout sélectionner

 :wink: 

[size=75]Message envoyé avec : [color=olive]Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.8.1.1) Gecko/20061208 Firefox/2.0.0.1[/color][/size]
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

Message par castafiore »

Ca te semble très simple, Calimo, visiblement :lol: mais pour moi ce n'est pas clair du tout.

Est-ce que tu pourrais avoir la gentillesse d'écrire ce code comme tu penses qu'il doit être écrit? Je n'y arrive pas :cry:

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

Il vient de le faire, regarde la différence avec le tien.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
castafiore
Arias
Messages : 8
Inscription : 17 févr. 2007, 09:36

Message par castafiore »

Merci SB

Je me sens vraiment le roi des nuls :wink:

Et merci aussi à toi, Calimo :D

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.0.9) Gecko/20061206 Firefox/1.5.0.9

edit: après l'avoir testé, je constate que ça ne marche pas non plus avec ce code corrigé par calimo, malheureusement.

Laissez tomber, c'est trop compliqué cette affaire.

En tout cas, grand merci pour votre aide :wink:
SB
Varan
Messages : 1095
Inscription : 05 mars 2004, 18:38

Message par SB »

C'est parce que dans sa hâte Calimo n'a toujours pas ajouté le "return false". Essaie ça :

Code : Tout sélectionner

<script type="text/javascript">
<!--
function test() {
var Lien = document.getElementById('reponse').value; var Status = open(Lien,"_self");
}
// End -->
</script>
<form name="formulaire" onsubmit="javascript:test(); return false" style="text-align:center" action="">
<input id="reponse" name="reponse" size="50"><input value="envoi" type="submit">
</form>
Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.1) Gecko/20061204 Firefox/2.0.0.1
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 2 invités