Discussion :

[Inarius]

Bonjour à tous,
Alors voila je suis en train de réaliser une application web, mais n'étant pas expert dans le domaine et surtout débutant, je demande votre aide.

Donc pour les technologies qui seront utilisés pour cette application, il y aura :
- PHP du coté du serveur (j'y ai déjà quelques connaissances)
- MySQL pour la sauvegarde des données
- AJAX pour la communication entre le client et le serveur (j'y ai également quelques connaissances sans être très avancé)
- XML pour la transmission des données (c'est surtout la où j'ai des problêmes)
- XUL pour l'interface utilisateur

Donc pour l'instant j'ai un problême au niveau de la transmission des données entre le serveur et le client. Je génère donc un fichier XML dynamiquement grâce à simpleXML que je renvoit au client avec AJAX. Je le traite ensuite avec Javascript mais c'est la que ca ne marche pas. Il me dit que xhr.responseXML est 'null'.

Voila les codes sources :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
coté serveur / PHP:
 
$reponse = mysql_query("SELECT * FROM acheteur ORDER BY numAcheteur");
 
            $xml = '<?xml version="1.0" encoding="UTF-8" ?>';
            $xml .= '<vente>';
 
            while ($donnee = mysql_fetch_array($reponse)) {
                $xml .= '<acheteur>';
                $xml .= "<numAcheteur>" . $donnee['numAcheteur'] . "</numAcheteur>";
                $xml .= "<nom>" . $donnee['nom'] . "</nom>";
                $xml .= "<prenom>" . $donnee['prenom'] . "</prenom>";
                $xml .= "<adresse>" . $donnee['adresse'] . "</adresse>";
                $xml .= "<codePostal>" . $donnee['codePostal'] . "</codePostal>";
                $xml .= "<ville>" . $donnee['ville'] . "</ville>";
                $xml .= "<facture>" . $donnee['facture'] . "</facture>";
                $xml .= '</acheteur>';
            }
 
            $xml .= '</vente>';
            header("Content-type: application/xml");
            echo $xml;

Code :

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

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
59
60
 
coté client / AJAX :
var xhr = null;
 
function afficherAcheteur() {
	if (xhr && xhr.readyState != 0) {
		xhr.abort();
	}
 
	xhr = new XMLHttpRequest();
 
	xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
                    var tableau = xml2table(xhr.responseXML);
                }
	};
 
	xhr.open("POST", "fichier/page/acheteur.php", true);
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xhr.send("action=afficher");
}
 
function xml2table(xml) {    
    var i =0;
    var facture = '';
 
    var table = '';
    table += '<html:table id="tableauAcheteur">';
    table += '<html:thead id="headTableuAcheteur">';
    table +=    '<html:tr id="ligneHeadTableauAcheteur">';
    table +=        '<html:td id="numAcheteurHeadTableauAcheteur">Numéro de l\'acheteur</html:td>';
    table +=        '<html:td id="nomHeadTableauAcheteur">Nom</html:td>';
    table +=        '<html:td id="prenomHeadTableauAcheteur">Prénom</html:td>';
    table +=        '<html:td id="adresseHeadTableauAcheteur">Adresse</html:td>';
    table +=        '<html:td id="codePostalHeadTableauAcheteur">Code postal</html:td>';
    table +=        '<html:td id="villeHeadTableauAcheteur">Ville</html:td>';
    table +=        '<html:td id=factureHeadTableauAcheteur">Facture</html:td>';
    table +=    '</html:tr>';
    table += '</html:thead>';
    table += '<html:tbody id="bodyTableauAcheteur>';
 
    while (numAcheteurs[i] != undefined) {
        (xml.selectNodes("/vente/acheteur[" + i + "]/nom") == 0) ? facture = 'non' : facture = 'oui';
 
        table += '<html:tr id="ligneBodyTableauAcheteur">';
        table +=    '<html:td id="numAcheteurBodyTableauAcheteur>' + xml.selectNodes("/vente/acheteur[" + i + "]/numAcheteur") + '</html:td>';
        table +=    '<html:td id="nomBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/nom") + '</html:td>';
        table +=    '<html:td id="prenomBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/prenom") + '</html:td>';
        table +=    '<html:td id="adresseBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/adresse") + '</html:td>';
        table +=    '<html:td id="codePostalBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/codePostal") + '</html:td>';
        table +=    '<html:td id="villeBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/ville") + '</html:td>';
        table +=    '<html:td id="factureBodyTableauAcheteur">' + facture + '</html:td>';
        table += '</html:tr>';
    }
 
    table += '</html:tbody>';
    table += '</html:table>';
 
    return table;
}

Comme pour l'instant, c'est la transmission qui me pose problème, je n'ai pas encore coder la partie qui affichera ce tableau dans l'interface utilisateur.

PS: l'application ne tournera que sous Firefox, c'est pour cela qu'il n'y a que l'instanciation de l'objet XMLHttpRequest.

EDIT: j'ai réécrit le PHP ca semblerait que ca marche un peu mieux car maintenant si j'écrit ce que produit le PHP dans un fichier texte, il y a bien du XML

[DoubleU]

Salut, et bienvenue Inarius.

Tu devrais utiliser l'extension firebug pour débugger ton javascript, et voir les requêtes http qui transitent. Ainsi, tu pourrais voir si la réponse à ta requête contient bien ce que veux.

Par ailleurs, essaie avec un header text/xml. Vérifie également que tu n'as pas d'espace ou de retour a la ligne qui trainent hors de tes balises <?php ?> et qui seraient ajoutées à ton insu dans la réponse.

[Inarius]

salut DoubleU et merci pour tes réponses.

J'utilise déjà firebug et dans la partie Console voila ce qui transite (meme avec un text/xml):

xml is null

C'est à dire que aucun XML n'est transmis. Or le PHP génère bien du XML (car je peut l'enregistrer dans un fichier texte).

Pour les espaces qui transitent, le fait est que sur cette page PHP, il y a toutes les méthodes qui permettent de modifier un des objet dans la BDD (SELECT, INSERT, UPDATE, DELETE).

EDIT: ne pourrait 'on pas faire comme le framework prototype avec le json en le passant dans l'entete de la reponse Ajax ?

[DoubleU]

Ta réponse contient bien le contenu du xml?

Parce que si ta réponse contient bien le xml, et que le xhr.responseXML plante, c'est sans doute a cause de caractères qui trainent avant ou apres tes balises.

[Inarius]

Ce qui est bizarre c'est qu'il n'y aurait aucune reponse XML car dnas firebug, dans la partie reponse de la requeteAjax dans la console, il y a un bouton "Load Reponse". Il semblerait donc que le php ne renvoi rien du tout...

PS: si ca peut aider, quand je remplace le alert(xhr.responseXML) par alert(xhr.responseText), cela ne m'affiche rien du tout, un grand vide ...

EDIT: Voici les codes sources complet:

Code :

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

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
59
60
61
62
 
acheteur.php
 
<?php
	mysql_connect('serveur', 'identifiant', 'mdp');
	mysql_select_db('base');
 
	if (isset($_POST['action']))
		$action = $_POST['action'];
	else
		$action = '';
 
	if ($action == 'afficher') {
            header('Content-Type: text/xml');
 
            $reponse = mysql_query("SELECT * FROM acheteur ORDER BY numAcheteur");
 
            $xml = '<?xml version="1.0" encoding="UTF-8" ?>';
            $xml .= '<vente>';
 
            while ($donnee = mysql_fetch_array($reponse)) {
                $xml .= '<acheteur>';
                $xml .= "<numAcheteur>" . $donnee['numAcheteur'] . "</numAcheteur>";
                $xml .= "<nom>" . $donnee['nom'] . "</nom>";
                $xml .= "<prenom>" . $donnee['prenom'] . "</prenom>";
                $xml .= "<adresse>" . $donnee['adresse'] . "</adresse>";
                $xml .= "<codePostal>" . $donnee['codePostal'] . "</codePostal>";
                $xml .= "<ville>" . $donnee['ville'] . "</ville>";
                $xml .= "<facture>" . $donnee['facture'] . "</facture>";
                $xml .= '</acheteur>';
            }
 
            $xml .= '</vente>';
 
            $fichier = fopen('../../acheteur.xml', 'w+');
            fwrite($fichier, $xml);
            fclose($fichier);
 
            echo $xml;
        } else if ($action == 'supprimer') {
 
		$numAcheteur = $_POST['numAcheteur'];
		if ($numAcheteur != '' && $numAcheteur != null)
			$reponse = mysql_query("DELETE FROM acheteur WHERE numAcheteur='$numAcheteur'");
 
	} else if ($action == 'ajouter') {
 
		$numAcheteur = $_POST['numAcheteur'];
		$nom = $_POST['nom'];
		$prenom = $_POST['prenom'];
		$adresse = $_POST['adresse'];
		$codePostal = $_POST['codePostal'];
		$ville = $_POST['ville'];
		$facture = $_POST['facture'];
 
		$reponse = mysql_query("INSERT INTO acheteur VALUES ('$numAcheteur', '$nom', '$prenom', '$adresse', '$codePostal', '$ville', '$facture')");
 
	} else if ($action == '') {
 
	}
    mysql_close();
?>

Code :

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

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
59
60
61
 
script.js
 
function afficherAcheteur() {
        var xhr = new XMLHttpRequest();
 
	xhr.onreadystatechange = function() {
                if (xhr.readyState == 4 && (xhr.status == 200 || xhr.status == 0)) {
                    alert('Reponse de la requete ajax : ' + xhr.responseXML);
                    var tableau = xml2table(xhr.responseXML);
                }
	};
 
	xhr.open("POST", "fichier/page/acheteur.php", true);
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xhr.send("action=afficher");
}
 
 
function xml2table(xml) {
 
    alert(xml.selectNodes("/vente/acheteur[0]/numAcheteur"));
    alert('hello');
 
    var i =0;
    var facture = '';
 
    var table = '';
    table += '<html:table id="tableauAcheteur">';
    table += '<html:thead id="headTableuAcheteur">';
    table +=    '<html:tr id="ligneHeadTableauAcheteur">';
    table +=        '<html:td id="numAcheteurHeadTableauAcheteur">Numéro de l\'acheteur</html:td>';
    table +=        '<html:td id="nomHeadTableauAcheteur">Nom</html:td>';
    table +=        '<html:td id="prenomHeadTableauAcheteur">Prénom</html:td>';
    table +=        '<html:td id="adresseHeadTableauAcheteur">Adresse</html:td>';
    table +=        '<html:td id="codePostalHeadTableauAcheteur">Code postal</html:td>';
    table +=        '<html:td id="villeHeadTableauAcheteur">Ville</html:td>';
    table +=        '<html:td id=factureHeadTableauAcheteur">Facture</html:td>';
    table +=    '</html:tr>';
    table += '</html:thead>';
    table += '<html:tbody id="bodyTableauAcheteur>';
 
    while (numAcheteurs[i] != undefined) {
        (xml.selectNodes("/vente/acheteur[" + i + "]/nom") == 0) ? facture = 'non' : facture = 'oui';
 
        table += '<html:tr id="ligneBodyTableauAcheteur">';
        table +=    '<html:td id="numAcheteurBodyTableauAcheteur>' + xml.selectNodes("/vente/acheteur[" + i + "]/numAcheteur") + '</html:td>';
        table +=    '<html:td id="nomBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/nom") + '</html:td>';
        table +=    '<html:td id="prenomBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/prenom") + '</html:td>';
        table +=    '<html:td id="adresseBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/adresse") + '</html:td>';
        table +=    '<html:td id="codePostalBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/codePostal") + '</html:td>';
        table +=    '<html:td id="villeBodyTableauAcheteur">' + xml.selectNodes("/vente/acheteur[" + i + "]/ville") + '</html:td>';
        table +=    '<html:td id="factureBodyTableauAcheteur">' + facture + '</html:td>';
        table += '</html:tr>';
    }
 
    table += '</html:tbody>';
    table += '</html:table>';
 
    return table;
}

[DoubleU]

Comment tu appelles ta fonction afficherAcheteur()?

Parce que comme ta variable xhr est globale, s'il se trouve que tu l'utilises pour 2 requetes au meme moment, il va y avoir un problème.

Sinon, le reste m'a l'air correct, je vois mal ce qui peut planter.

[Inarius]

Comme l'interface graphique est en XUL la requete AJAX est appele par l appui sur un bouton avec <button oncommand="afficherAcheteur()" />

EDIT: deplus je vient d'enlever le "caractère globale" de xhr. Et ca plante toujours :'(

merci pour l'aide
Inarius

[Inarius]

J'ai finalement completement changer le mode de fonctionnement. Ca a maintenant d'autre avantage et c'est surtout plus divisé pour mieux reussir ^^

Donc il y a maintenant :
- une fonction pour mettre a jour le fichier XML qui est la mise en page XML de la BDD ( majXmlAcheteur() )
- une fonction qui va récupérer ce fichier XML ( getXmlAcheteur() )
- une fonction qui va changer ce fichier XML en tableau xHTML ( xml2table(xml) )
- une fonction qui les appellent toutes l'une apres l'autre. ( afficherAcheteur() )

Je vais donc maintenant faire une fonction qui met a jour toutes les 5 secondes le fichier XML sur le serveur pour être sur d'être a jour. Et ce fichier XML sera également mis a jour dès qu'il y aura modification ou suprression d'un des éléments de la bdd.