JeuWeb - Crée ton jeu par navigateur
[Résolu][Ajax] Formulaire - Version imprimable

+- JeuWeb - Crée ton jeu par navigateur (https://jeuweb.org)
+-- Forum : Discussions, Aide, Ressources... (https://jeuweb.org/forumdisplay.php?fid=38)
+--- Forum : Programmation, infrastructure (https://jeuweb.org/forumdisplay.php?fid=51)
+--- Sujet : [Résolu][Ajax] Formulaire (/showthread.php?tid=2273)



[Résolu][Ajax] Formulaire - Ogham - 13-01-2008

Bonsoir,

Voilà, j'essaie d'ajouter un peu d'ajax à ma carte pour alléger les affichages et comme je suis plus que noob en la matière je chemine de tutos en tutos et là je bloque sur un truc.

Ma carte est dotée d'une console (à la manière de dofus pour ceux qui connaisse) une sorte de menu pour les autres.
Dans cette console il y a un formulaire muni de 4 boutons submit qui permettent de se déplacer dans les 4 directions et un champ input text pour indiquer la distance à parcourir.

Il y a aussi un DIV où doivent s'afficher les comptes rendus des actions sans recharger la carte complète donc.

Pour le moment j'ai intégré le bouton submit qui indique qu'on va se déplacer vers la droite.
Une fonction javascript transmet cette info à un script php et affiche le résultat dans la DIV sans recharger la page.

Jusque là tout va bien ça marche.
Seulement voilà je n'arrive pas à intégrer mon input text et à récupérer la variable transmise.
Je ne sais pas comment transmettre cette variable via javascript.

Voilà ce que j'ai fais pour le moment:

Code PHP :
<?php 
// le pseudo formulaire qui appelle le fichier deplacement_droite.js

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<
head>
<
script type="text/javascript" src="deplacement_droite.js"></script>

</
head>
<
body>
<
h1>tests ajax</h1>
<
input id="droite" name="droite" type="submit" onclick="droite();" value="droite" />
<
div id="heure" name="heure">Le resultat s'affiche ici</div>
</body>
</html>

Code PHP :
<?php 
// Le fichier javascript

var xmlHttp;

function
droite()
{
var
val = document.getElementById("droite").name;


xmlHttp = GetXmlHttpObject();
if (
xmlHttp == null)
{
alert("Votre navigateur ne supporte pas les requêtes HTTP.");
return
false;
}
var
url="exemple2.php";

xmlHttp.onreadystatechange = function (){
if (
xmlHttp.readyState == 4 || xmlHttp.readyState == "complete")
{

document.getElementById("heure").innerHTML = xmlHttp.responseText;

}
}
var
params = "droite="+val;
xmlHttp.open("POST", url, true);
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;");
xmlHttp.send(params);
return
true;
}

function
GetXmlHttpObject()
{
var
objXMLHttp=null;
if (
window.XMLHttpRequest)
objXMLHttp=new XMLHttpRequest();
else if (
window.ActiveXObject)
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP");
return
objXMLHttp;
}

Code PHP :
<?php 
// Le fichier php qui récupère la variable

<?php

if (isset($_POST['droite']))
{
echo
$_POST['droite'];

}
else
{
}
?>

Est ce que quelqu'un pourrait m'expliquer comment transmettre des données de formulaire à mon fichier php via Javascript ?
Merci.


RE: AJAX et formulaire - Ogham - 14-01-2008




RE: AJAX et formulaire - Ogham - 14-01-2008




RE: AJAX et formulaire - jo_link_noir - 14-01-2008

ça te choque vraiment pas Oo
t'as pensé à mettre des id avec un nom diffèrent ?


RE: AJAX et formulaire - Sephi-Chan - 14-01-2008

Citation :Un nom explicite valable dans tout le fichier pour un élément - quand vous marquez un élément avec cet attribut n'attribuez pas de nom id dans le fichier HTML plus d'une fois.



RE: AJAX et formulaire - Ogham - 14-01-2008

Citation :ça te choque vraiment pas Oo
t'as pensé à mettre des id avec un nom diffèrent ?

ben oui dans le code juste au dessus, avec ou sans les id le résultat est le même ,je ne récupère qu'une seule valeur, la première ou la dernière selon le cas.

Citation :Un nom explicite valable dans tout le fichier pour un élément - quand vous marquez un élément avec cet attribut n'attribuez pas de nom id dans le fichier HTML plus d'une fois.

Oui mais ayant de toute façon testé ça dans tous les sens je ne suis plus à ça prêt.

extrait de la documentation xajax au sujet des id
Citation :NOTE: Précisez bien les id (en plus des name) dans les attributs des formulaires. Si vous oubliez de préciser l'id, Internet Explorer utilise la valeur du tag name comme id et la fonction getFormValues marchera quand même. Mais Firefox ne trouvera pas les formulaires !

NOTE: Avec Firefox, assurez vous de mettre un attribut name à tous les champs que vous voulez récupérer avec la fonction getFormValues. Juste l'attribut id ne fonctionnera pas.

Cependant cela fonctionne également sans les id (pour un seul bouton), peut être est ce du à la nouvelle version de firefox.

Le même formulaire mis hors de la fonction fonctionne très bien.


RE: AJAX et formulaire - jo_link_noir - 14-01-2008

A moins de devenir aveugle, dans le 1er code je vois : id="direction" name="direction" et ça répété 4 fois...
Quand on 2ème les id sont inexistant.


RE: AJAX et formulaire - Ogham - 14-01-2008

En effet, c'est pourquoi je répond à ta question Smile je ne vais pas non plus afficher tous mes tests infructueux si ?

Dans mon premier post lorsque je disais :
" j'ai essayé de traiter le formulaire normalement en php "
ça voulait dire en attribuant des valeurs différentes à chaque bouton, enfin normalement quoi.Certes ce n'étais pas clair.

Donc pour récapituler:
Boutons identiques avec ou sans id ça marche pas
Boutons différents avec ou sans id ça marche à condition de traiter le formulaire hors de la fonction et je ne comprends pas pourquoi.


RE: AJAX et formulaire - Ogham - 31-01-2008

bonjour,

J'ai finalement trouvé une solution, ne parvenant pas à traiter mes quatre boutons dans la même fonction, j'ai créé une fonction pour chaque direction et ça fonctionne parfaitement.

voilà le sujet est donc clos.