[AJAX] création puis récupération du fichier xml

Version imprimable

Re bonjour,
me revoila encore pour mes petites contines en ajax.

Voila j'arrive via mon code à afficher par le bied d'un alert le contenue d'un fichier xml.
Cependant, j'aimerai rajouter à l'évennement clique la création d'un fichier xml ( qui ira chercher des informations dans la base de données )

En finalité cela aura pour but de remplir automatiquement un formulaire avec la saisie simple d'un numéro client par exemple.

Voici le code javascript modifié :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 function ajax() { var xhr=null; if (window.XMLHttpRequest) { xhr = new XMLHttpRequest(); } else if (window.ActiveXObject) { xhr = new ActiveXObject("Microsoft.XMLHTTP"); } //on définit l'appel de la fonction au retour serveur xhr.onreadystatechange = function() { alert_ajax(xhr); }; ch = document.formulaire.test.value; alert(ch); http.open("GET", "xml.php?test=" + escape(ch), true); //on appelle le fichier reponse.txt xhr.open("GET", "reponse.xml", true); xhr.send(null); }
pour résumer voila les deux lignes importantes :
http.open("GET", "xml.php?test=" + escape(ch), true);
//on appelle le fichier reponse.txt
xhr.open("GET", "reponse.xml", true);
j'aimerai créer mon fichier reponse.xml grâce au premier open et le lire via la suite de mon traitement par la suite.
J'ai due louper un épisode quelque part.

Merci d'avance d'éclairer ma lanterne.

07/05/2009, 11h29
DoubleU

Ce que tu dois faire, c'est appeler xml.php, et dans ce script, retourner une réponse formatée en xml, mais pas faire deux appels, l'un pour créer le xml, l'autre pour l'ouvrir.

Tu n'as pas besoin de sauvegarder réellement un fichier xml correspondant à ta réponse (sauf si tu en as vraiment besoin pour autre chose, mais ca serait surprenant).
07/05/2009, 11h32
Eva01

ce que tu veux dire, c'est par exemple, sur le onkeyup de ma zone de saisie, faire un evennement qui va créer mon fichier "reponse.xml" sans le sauvegarder forcément, puis sur le keypressed"13" je reprends mon ancien traitement pour récupérer les données dans mon formulaire par exemple ?
remarque dans le premier traitement je ne ferai que remplir mon fichier sauvegardé sur le serveur, reponse.xml ?

Non, tu as mal compris.

Tu as un seul évenement (onkeyup, onkeypressed comme tu veyx) et une seule requete (qui atterrira sur ta page php).
Et c'est dans cette page php que tu vas retourner un flux xml, comme si tu avais appelé un fichier xml directement.

Dans l'idée, ton script ressemblerait à ca:
Code:

1 2 3 4 5 6 7 <?php header("content-type:text/xml"); // tres important pour dire que la réponse qui va suivre doit être traitée comme du xml echo '<?xml version="1.0" encoding="UTF-8"?>'; echo '<racine>'; echo '<fils></fils>'; echo '</racine>'; ?>

07/05/2009, 11h41
Eva01

d'accord, donc cela veut dire que sur mon évennement, j'envoie donc ma variable, et dans ma page php je récupère mes données puis les structure dans mon fichier xml.

Je n'ai pas trouvé de tutos ou quelque chose dans le genre montrant cette manipulation, j'avoue ne pas savoir comment m'y prendre, as tu des liens qui pourraient m'être utile ?
07/05/2009, 11h47
DoubleU

Citation:

dans ma page php je récupère mes données puis les structure dans mon fichier xml

Tu t'es peut être mal exprimée, ou alors tu as mal compris ce point, mais tu n'as PAS de fichier xml.

Citation:

Je n'ai pas trouvé de tutos ou quelque chose dans le genre montrant cette manipulation, j'avoue ne pas savoir comment m'y prendre, as tu des liens qui pourraient m'être utile ?

Tu as plusieurs façons de faire, soit en utilisant les api xml dédiées, soit un construisant une chaine de caractère formatée comme du xml, un peu comme je t'ai montré.

Très bien donc dans ma page PHP je construit une chaine formaté comme du xml et concernant la récupération des données, cela va ressembler à quelque chose comme sa alors ?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function Tajax()
{
    var xhr=null;
 
    if (window.XMLHttpRequest) { 
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) 
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    //on définit l'appel de la fonction au retour serveur
    xhr.onreadystatechange = function() { alert_ajax(xhr); };
    ch = document.formulaire.test.value; 
    alert(ch);
	http.open("GET", "xml.php?test=" + escape(ch), true); 	
    xhr.send(null);
	document.formulaire.zsnom = http.responseXml.getElementsByTagname("donne");
}

voila j'ai repris le tout et j'ai essayé donc à ma sauce voici ce que sa donne :

Page index.html

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
<!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>
	<title>exemple 500000</title>
</head>
<body>
 
<script type="text/javascript">
	function getXhr(){
                                var xhr = null; 
				if(window.XMLHttpRequest) // Firefox et autres
				   xhr = new XMLHttpRequest(); 
				else if(window.ActiveXObject){ // Internet Explorer 
				   try {
			                xhr = new ActiveXObject("Msxml2.XMLHTTP");
			            } catch (e) {
			                xhr = new ActiveXObject("Microsoft.XMLHTTP");
			            }
				}
				else { // XMLHttpRequest non supporté par le navigateur 
				   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
				   xhr = false; 
				} 
                                return xhr;
			}
 
function go(){
				var xhr = getXhr();
				// On défini ce qu'on va faire quand on aura la réponse
				xhr.onreadystatechange = function(){
					// On ne fait quelque chose que si on a tout reçu et que le serveur est ok
					if(xhr.readyState == 4 && xhr.status == 200)
					{
						// On se sert de innerHTML pour rajouter les options a la liste
						 	ch = document.formulaire.id.value; 
						 	http.open("GET", "xml.php?id=" + escape(ch), true); 	
							xhr.send(null);
							document.formulaire.nom.innerHTML = xhr.responseXml.getElementsByTagname("nom");
							document.formulaire.pnom.innerHTML = xhr.reponseXml.getElementsByTagname("pnom");
					}
				}
 
</script>
 
<p>
<a href="javascript:go();">Valider</a>
</p>
 
<form action="index.html" name="formulaire">
<input type="text" id="id" valeur="id client" name="id" onkeyup="go();">
<input type="text" id="nom" name="nom">
<input type="text" id="pnom" name="pnom">
 
</form>
 
</body>
</html>

page xml.php

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<?php  
    include('config.php'); 
    $abr = $_GET['abr']; 
    $q = 'SELECT name from clients WHERE id =  '.$abr.'; '
    $r = mysql_query($q); 
    if ((mysql_num_rows($r)>0))
        {    
                 header("content-type:text/xml"); // tres important pour dire que la réponse qui va suivre doit être traitée comme du xml
                 echo '<?xml version="1.0" encoding="UTF-8"?>';
                  echo '<exemple>';
        while ($rep=mysql_fetch_array($r)){ 
                 echo '<nom>';        
         echo $rep['nom'];
                 echo '</nom>';
                 echo '<pnom>';
                 echo $rep['pnom'];
                 echo'</pnom>';  
        } 
          echo '</exemple>';
    }    
 
?>

Salut, un input text n'as pas de innerHTML mais value.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
function Tajax()
{
    var xhr=null;
 
    if (window.XMLHttpRequest) { 
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) 
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    ch = document.formulaire.id.value; 
    alert(ch);
	http.open("GET", "xml.php?id=" + escape(ch), true);
	xhr.onreadystatechange = function()
	{if (xhr.readyState == 4 || xhr.status == 200)
		{
			var rst=xhr.responseXML;
			var resultat='';
			for(var i=0; i<rst.getElementsByTagname('donne').length; i++)
			{
				resultat+=rst[i].firstChild.nodeValue+' ';
			}
			document.forms['formulaire'].elements['nom'].value=resultat;
		}
	}
    xhr.send(null);
}

Tu envoyes id mais tu récupères abr.

Code:

$abr = $_GET['id'];