Afficher les éléments enfants avec AJAX

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Afficher les éléments enfants avec AJAX

Afficher les éléments enfants avec AJAX

par Aureusms » 21 déc. 2008, 17:43

Bonjour,

Je viens de me mettre à l'AJAX version XML (pour l'instant je ne me servais que de la fonction responseText.) et bien sûr il y a encore des trucs que je ne comprends pas.
Je vous explique mon problème. Je génère sous PHP un XML suivant :
	   header ('Content-Type: text/xml');
	   $xml = "<menu>
<bouton>
<nom>Accueil</nom>
<lien>index.php</lien>
<title>Allez vers l'accueil</title>
</bouton>
<bouton>
<nom>Profil</nom>
<lien>index.php?affiche=profil</lien>
<title>Allez vers votre profil</title>
</bouton>
</menu>";
	   $xml = trim ($xml);
	   echo $xml;
Ce qui me donne un bon fichier XML :

Code : Tout sélectionner

<menu> <bouton> <nom>Accueil</nom> <lien>index.php?</lien> <title>Allez vers l'accueil</title> </bouton> <bouton> <nom>Profil</nom> <lien>index.php?affiche=profil</lien> <title>Allez vers votre profil</title> </bouton> </menu>
J'essaye donc d'afficher un menu sous HTML pour obtenir ce qui suit :

Code : Tout sélectionner

<div class="ombre"> <div> <a title="Allez vers l'accueil" href="index.php?"> Accueil </a> </div> </div> <div id="active" class="ombre"> <div> <a title="Allez vers votre profil" href="index.php?affiche=profil"> Profil </a> </div> </div>
J'ai donc créé un Javascript avec (je vous épargne XMLhttprequest...):

Code : Tout sélectionner

//assigne le premier element var xmlResponse = xmlHttp.responseXML; xmlRoot = xmlResponse.documentElement; //on créé les tableaux de réponse des boutons boutonArray = xmlRoot.getElementsByTagName("bouton"); //on créé la sortie HTML var html = '<div id="menu">'; for (var i=0 ; i<boutonArray.length; i++) { html += '<div class="ombre">'; html += '<div><a href="' + boutonArray.item(i).firstChild.nodeValue + '" title="'+boutonArray.item(i).firstChild.nodeValue+'" >'+boutonArray.item(i).firstChild.nodeValue+'</a></div>'; html += '</div>'; } html += '</div>'; //on affiche la div divMenuXml = document.getElementById("menu_xml"); divMenuXml.style.display = "block"; divMenuXml.innerHTML = html;
Cela m'affiche bien les deux boutons mais rien dedans... Je crois que je me trompe dans la navigation de l'arborescence javascript<->XML
Quelqu'un peut-il me guider ?

EDIT : je métais trompé dans la ligne avec .firstChild.nodeValue. mais toujours pas résolue...

EDIT : J'ai en fait chercher un peu plus loin et ai remplacé par : cet exemple fonctionne mais n'est pas optimisé :

Code : Tout sélectionner

var html = '<div id="menu">'; for (var i=0 ; i<boutonArray.length; i++) { var titleName = boutonArray.item(i).childNodes[5].firstChild.data; var lienName = boutonArray.item(i).childNodes[3].firstChild.data; var nomName = boutonArray.item(i).childNodes[1].firstChild.data; html += '<div class="ombre" title="'+titleName+ '">'; html += '<div><a href="' + lienName + '" >'+ nomName +'</a></div>'; html += '</div>'; } html += '</div>';
EDIT : J'ai finalement trouvé sur le site de Mozilla:
J'ai remplacé par

Code : Tout sélectionner

var titleName = boutonArray.item(i).getElementsByTagName("title").item(0).firstChild.data; var lienName = boutonArray.item(i).getElementsByTagName("lien").item(0).firstChild.data; var nomName = boutonArray.item(i).getElementsByTagName("nom").item(0).firstChild.data;