JeuWeb - Crée ton jeu par navigateur
[Javascript] Récupérer des données sur une page - 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 : [Javascript] Récupérer des données sur une page (/showthread.php?tid=2838)

Pages : 1 2


[Javascript] Récupérer des données sur une page - Kassak - 03-08-2008

C'est encore moi et mes soucis concernant l'ajax/javascript..

C'est toujours en rapport aux autres topics, cette fois ci j'ai un problème pour récupérer des données sur une page, je vous explique :


On clique sur une case, ajax envoie à la page deplacement.php les coordonnées de la case et le script fait tout son bordel, ensuite j'actualise la div qui contient la map. Donc la pas de soucis.

Le souci, je n'arrive pas à récupérer de données de ma page deplacement.php (les messages d'erreurs), pour l'instant, la seule technique que je connaisse étant une bille en ajax, c'est de faire des echos sur ma page deplacement.php, et ensuite afficher ces echos dans une div comme ceci : document.getElementById('error').innerHTML = xhr.responseText;, mais cela ne marche bien sur pas du tout.


J'ai ensuite un autre hic, ce code est il correct :
Code PHP :
<?php 
document
.getElementById('menu').innerHTML = '<'+'? include("menu_joueur.php");?'+'>';

Ceci afin de rafraichir tout le menu joueur après un déplacement, ce code ne marche pas, les '+' me permettent d'éviter un unterminated string literal, mais le refresh ne se fait pas, peut être que le include est le problème?


RE: Soucis de JS (encore) - Lanwin - 03-08-2008

D'après moi, le souci vient bien de l'include...

Le langage PHP est fait pour être éxécuté lors de la génération de la page... Une fois celle-çi générée, il n'y a plus moyen de faire exécuter du PHP directement.

La seule solution est d'utiliser Ajax.

Après je peux me tromper, mais je ne pense pas ^^

Amicalement,


RE: Soucis de JS (encore) - Sephi-Chan - 03-08-2008

En fait, la technique du document.getElementById('error').innerHTML = xhr.responseText; fonctionne très bien. C'est juste que ça n'est pas propre.

Le mieux, pour un Ajax propre, c'est de récupérer un objet JSON (ou autre format) et de recréer un DOM propre grâce à son contenu.

Je ne me suis jamais intéressé à ça sans utiliser de librairie, donc je ne peux pas vraiment t'en dire plus, mais c'est une piste.


Sephi-Chan


RE: Soucis de JS (encore) - Kassak - 03-08-2008

Le truc c'est que ce langage me prends vraiment la tête, donc pour ta deuxième solution Sephi-Chan on verra plus tard, j'ai pas le courage, pour le moment je souhaite juste faire marcher celle ci..

Des pistes pour trouver l'erreur? Je vous montre le script tant qu'à faire :

Code PHP :
<?php 
<script language="javascript">
var
xhr = null;

// CREE UN ELEMENT XMLHttpRequest
function get_Xhr()
{
if(
window.XMLHttpRequest)
{
xhr = new XMLHttpRequest();
}
else if(
window.ActiveXOject)
{
try
{
xhr = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(
e)
{
try
{
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(
el)
{
xhr = null;
}
}
}
else
{
alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest\nVeuillez le mettre à jour");
}
return
xhr;
}

// Charge un fichier dans un div
function LoadDiv(div,file){
get_Xhr();
xhr.onreadystatechange = function()
{
if(
xhr.readyState == 4 && xhr.status == 200)
{
document.getElementById(div).innerHTML = xhr.responseText;
}
}
xhr.open("POST",file,true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send("type="+div);
}


// Deplacement d'un perso. sur la carte
function move(x,y,map)
{
// Creation de l'objet XMLHttpRequest
get_Xhr();
xhr.onreadystatechange = function()
{
// Reponse du script
if(xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0))
{
LoadDiv("map","test.php");
document.getElementById('error').innerHTML = xhr.responseText;
document.getElementById('menu').innerHTML = '<'+'? include("menu_joueur.php");?'+'>';
}
}
// Nous allons interroger deplacement.php pour effectuer le deplacement
xhr.open("POST",'deplacement.php',true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send("posx="+x+"&posy="+y+"&map="+map);
}

</
script>


Donc la fonction loaddiv servant à refresh l'affichage de la map, et la fonction move servant au déplacement et au rafraichissement de la div map, error et du menu..


Pour ce qui est de l'include, ça m'embête un peu de devoir refaire une fonction juste pour ça, mais je vais y consacrer quelques cheveux, et i vous avez une solution plus simple...Wink


RE: Soucis de JS (encore) - Kassak - 04-08-2008

Se sera surement le dernier truc que je ferais en javascript et ajax pour un bon moment, donc inutile pour moi d'apprendre à utiliser ces 2 librairies.


Pour résumer, je souhaite récupérer les echos de ma page deplacement.php (apparemment ma technique est bonne, mais elle ne fonctionne pas), et mettre à jour la div "menu" qui contient un include de menu_joueur.php en même temps que la fonction LoadDiv charge la div map ( voir mon script plus haut )


RE: Soucis de JS (encore) - Eluox - 04-08-2008

L'includes dans le JS ne fonctionnera pas non ?


RE: Soucis de JS (encore) - Satevis - 04-08-2008

Oui y a peu de chance que ça marche Smile, le fait d'avoir séparer les chevrons des points d'interrogation fait que PHP ne reprend pas la main à ce moment et donc l'include n'est pas inclus Wink, ce qui se traduit par que JS met surement la chaîne littérale
Citation :<?include("menu_joueur.php");?>
dans ton innerHTML.
Ton "unterminated string literal" venait probablement du fait que dans ton menu_joueur renvois au moins une fois le même type de quotes (surement simple au vu de ton code) que celle que tu utile pour délimiter ta string en JS. Et même si le JS ne te générais pas d'erreur ton menu ne serais pas dynamique puisque tu remplacerait ta div menu par le même contenu à chaque fois, celui générer au moment de l'interprétation du PHP à l'appel de la page actuelle.
Te reste plus qu'a faire une autre fonction pour le menu Wink.

Pour récupérer tes erreurs as tu essayé avec un
Code :
alert(xhr.responseText)
c'est pas super propre mais ça marche toujours pour debug du JS Smile.


RE: Soucis de JS (encore) - Kassak - 05-08-2008

Donc donc, comme je le disais hier, j'ai réglé le problème des messages d'erreurs, la variable xhr était en faites "vidée" avant que je la récupère pour afficher les erreurs, en changeant l'ordre des lignes dans le script je l'ai réglé.


Maintenant j'ai un autre souci, j'ai refait une fonction, la même que celle que je vous ai montré, donc je crée un nouvel élément XMLHttpRequest (xhr1), je fait une nouvelle fonction LoadDivMenu afin de changer la div menu contenant l'include de menu_joueur.php, c'est exactement le même principe que celle d'avant.

Mais lorsque je me déplace maintenant, la page menu_joueur.php est bien mise à jour, mais au lieu qu'elle remplace celle présente dans la div menu, ce qui semblerait logique, elle s'affiche tout en haut de la page, bilan, j'ai deux menu, un qui n'est pas à jour, et un qui se met à jour à chaque clique.

J'ai beau faire exactement la même chose que pour la div map, mais la page menu_joueur.php s'affiche toujours tout en haut de la page, et dans le code source, il n'est généré qu'une fois, alors qu'il est affiché 2 fois...

J'ai pensé que cela venait du fait qu'il y avait pas mal de tableau, de div etc..dans la page menu_joueur mais même en modifiant, ou en ne laissant que le minimum c'est toujours pareil...

Une idée?


RE: Soucis de JS (encore) - Kassak - 05-08-2008

C'est toujours le même truc depuis le début Wink

Edit : Et j'espère que tu piges que ce genre de commentaire est complètement inutile.


RE: Soucis de JS (encore) - Kassak - 06-08-2008

Oxman, que tu me proposes une fois tes librairies, merci c'est sympa, mais j' explique la raison pour laquelle je ne les utiliserais pas une fois, je pense que ça suffit Wink

Sinon j'ai résolut mon problème de "duplication de la div", c'était en faites bel et bien les tableaux qui faisaient foirer l'include.

J'ai du donc séparer mon menu en deux, étant donné que c'est 2 parties d'un tableau.


Maintenant la dernière question de ce post, existe t-il en Ajax une fonction permettant de lancer plusieurs "lignes" de chargement de fonction ( je m'exprime mal, je parle du document.getElementById, LoadDiv(), etc...) en même temps?

Puisque lors du traitement de mon script, à la fin, je charge d'abord les messages d'erreur, et ensuite dans l'ordre refresh de la map, du 1er menu et du 2eme menu (c'est pas propre tout ça, mais c'était pour vite le régler afin de passer a autre chose), donc ça se voit à l'écran.