Discussion :

[Bootax]

Bonsoir,

J'aimerais quelques petits renseignements sur une méthode à utiliser. Je suis en train de developper une application web dont voici le principe de fonctionnement :

Je dispose d'un menu, lorsque l'on clique sur un de ses éléments, une requete est envoyé sur une page grace à ajax. C'est là que les choses se complique : Cette page se charge de collecter plusieurs information dans un fichier XML que je dois afficher dans plusieurs div different. C'est là que plusieurs interrogations interviennent :

Est-il possible d'avoir un tableau exploitable via javascript (pour affiche rles éléments dans different div) sachant que la page en question est en php ?

Sinon, quel pourrait être les autres manière de faire une tel opération ?

J'essaye de retourner l'idée dans tous les sens, mais j'avoue faire face à un flou total quand à la solution la mieux adaptée.

En vous remerciant,
Salutation.

[khayyam90]

Bien le bonsoir,

Si j'ai bien compris, tu voudrais que ta page php renvoie une liste d'informations clef / valeur pour mettre "valeur" dans le div référencé par "clef".

Pas de problème, ton script php devra renvoyer du texte que tu interprétera côté client pour en extraire les clefs/valeurs. Il pourra s'agir de code XML (auquel cas il faudra itérer sur les noeuds pour remplir les divs), de code JSON (auquel cas il faudra juste parcourir les éléments retournés pour remplir les divs).

Ton script serveur va collecter les données à afficher et va les sérialiser en XML ou JSON (ou autre chose si ça te chante) et le script JS va les désérialiser pour les traiter.

le plus simple :
côté PHP tu crées un tableau associatif clef / valeur que tu remplis comme tu veux. Tu renvoies un json_encode() de ce tableau.
côté JavaScript tu eval() ce texte et tu n'as qu'à boucler sur les éléments du tableau et récupérer clef / valeur. Puis document.getElementById("clef").innerHTML = "valeur";

[Bootax]

Merci poru ta réponse rapide. Cependant, je vais apporter quelques précision pour plus de clarté.

Si j'ai bien compris, tu voudrais que ta page php renvoie une liste d'informations clef / valeur pour mettre "valeur" dans le div référencé par "clef".

Le problème qui se pose là, c'est que j'ai plusieurs valeurs à mettre dans plusieurs divs. Par exemple, dans un div, je devrais mettre un titre et une date, qui doivent correspondre, et lors d'un clique sur cette ligne, je dois afficher un texte dans un autre div.

C'est assez difficile à expliquer comme truc en fait

[khayyam90]

Si tu as plusieurs valeurs à renvoyer pour chacun de tes divs, tu devras renvoyer quelque chose comme ça

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
[{id:"l'id du div", titre:"le titre du div", date:"la date", contenu:"le contenu de ton div"},
{id:"l'id du div2", titre:"le titre du div2", date:"la date2", contenu:"le contenu de ton div2"}, 
... ]

Et lors de la réception de cette chaine de caractères, tu l'évalues, puis tu boucles sur chaque élément {id+titre+date+contenu} et tu traites chaque champ comme il se doit.

[Bootax]

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
[{id:"l'id du div", titre:"le titre du div", date:"la date", contenu:"le contenu de ton div"},
{id:"l'id du div2", titre:"le titre du div2", date:"la date2", contenu:"le contenu de ton div2"}, 
... ]

Je ne comprends pas trop à quoi correspond tout ça, ca correspond à une chaine ? ou un tableau ?

J'suis pas super caller en javascript, j'ai juste des bases pour faire des trucs un 'kikoolol'

[khayyam90]

c'est un tableau sous forme JSON. C'est simple à générer côté PHP et simple à récupérer côté JS.

[Bootax]

C'est bien ce qui m'avait semblé comprendre, je me documente actuellement sur la maniere de créer des tableau au formart json via les éléments que je récupere en php. Cependant, je n'ai jamais été fortiche avec les tableaux, je crois qu'il est temps que je m'y mette serieusement. Je vais continuer de me documenter et chercher des tutoriels la dessus.

Je vais donc essayer de me débrouiller pour faire quelque chose de fonctionnel ! Si par hasard vous avez des liens vers des tuto expliquant tout ça, je suis preneur, trop d'info vaut mieux que pas assez !

[Bootax]

Yo, c'est remoi !

Bon alors après avoir potassé pas mal de doc, j'me suis tourner vers un tableau multi dimentionel créé en php et j'utilise la fonction json_encode();

dans la boucle qui récupere les infos j'ai :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
$result[$i] = array('titre' => "$titre",'desc' => "$desc",'lien' => "$lien");
$i++;

et ensuite :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
$arr = json_encode($result);
return $arr;

seulement, dans mon traitement de la réponse, il n'y pas moyen de récuperer ce tableau !

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
 if(xhr.readyState == 4 && xhr.status == 200){
 // Code à executer pour traiter la réponse
 var doc = eval('(' + xhr.responseText + ')'); 
 alert(doc);

J'ai essayé de differente façon, j'ai essayé un alert sur la réponse direct, mais aucun résultat

[Bovino]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
$arr = json_encode($result);
echo $arr;

[Bootax]

Oui, le echo fonctionne, mais le but étant de recuperer ce tableau en réponse à une requete ajax.

[Bovino]

Oui, le echo fonctionne, mais le but étant de recuperer ce tableau en réponse à une requete ajax.

return renvoie le résultat au script PHP, pas au navigateur, c'est pourquoi il faut utiliser echo et pas return !

[Bootax]

Ah d'accord, j'ai effectivement une réponse dans mon alert maintenant, mais celle-ci ressemble à [objet Objet],[objet Objet] ainsi de suite, autant de fois qu'il y a d'éléments. Je ne comprend pas comment pas traiter cette réponse

[Bovino]

Oui, c'est normal, le eval a transformé ton responseText en objet JavaScript, donc tu peux accéder directement à ses propriétés, par exemple, d'après l'exemple que tu as montré :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

alert(doc[0].titre);

[Bootax]

Bon, en fait, j'ai trouvé, il suffi de précisé ce qu'on veut dans le tableau via

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

alert(doc[id][champ]);

Seulement, j'ai l'impression que le tableau n'est pas ordonné dans le même sens une fois celui recuperé !

Par exemple, si j'affiche l'élément n°1 => titre côté serveur, j'obtiens bien le premier élément de mon fichier XML, mais côté client au traitement tu tableau, l'élément N°1 => titre ne correspond plus !

[Bovino]

C'est une des différences importantes entre un tableau et un objet : un tableau référence des valeurs en fonction de leur indice, un objet en fonction de propriétés (donc de couples nom/valeur), il n'y a donc pas d'ordre dans un objet.

[Bootax]

Hmm, d'accord, par conséquant je ne peux donc pas avoir exactement le même résultat des deux côtés. Si je rajoute une clé numéroté par exemple, est-ce qu'il serait possible de pouvoir le trier afin d'avoir un ordonnement correspondant ?

[khayyam90]

Tu ne dois pas faire d'hypothèse sur l'ordre des éléments de ton tableau côté JS. Si tu veux pouvoir associer correctement les données du tableau à des éléments de ta page, tu dois rajouter un champs dans chaque élément du tableau pour indiquer à quel élément de ta page on fait référence.
Tout simplement tu peux rajouter un champ id contenant l'id de ton div à modifier.

[Bootax]

Comment se fait-il que lorsque que je parcours mon tableau avec une boucle for, mes éléments passe en temps que "undefined" ?

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

for (i=0;i<tab.length;i++) {

J'essaye ensuite

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

str += ['i']['desc'];

ou encore

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

str += ["i"]['desc'];

ou même

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

str += [i]['desc'];

mais rien à faire, là, je nage, j'arrive toujours à un résultat undefined :/

J'ai aussi essayer un boucle comme :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

for (value in tab) {

[Bovino]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

str += tab[i]['desc'];

[Bootax]

Rohalalala.... Mais qu'est ce que j'ai honte... Quelle horreur... Vraiment désolé de pourrir le forum là.. :\

EDIT : Bon je mets Résolu, mes problème d'ajax et json sont règlé. merci beaucoup pour votre aide.