Doit faire XMLHttpRequest deux fois avant affichage du résultatRésolu

Question

Bonjour!
J'ai commencé récemment les XMLHttpRequest.  J'ai mis ci-dessous ma fonction. Je l'appelle lorsque je clique sur une checkbox et affiche le résultat (le contenu de la variable box) dans un paragraphe via la fonction verif4.
Le souci est que je dois cliquer deux fois pour afficher le résultat. La première fois, j'ai "null", c'est à dire l'initialisation de ma variable box.
Comment faire pour que le résultat s'affiche directement et pas au deuxième coup?

Je vous remercie d'avance pour tout aide.
box=null;

function boxAjax(noeud){

    var xhr;

        if(window.XMLHttpRequest || window.ActiveXObject) {

                if(window.XMLHttpRequest) {//instanciation de la requete

                        xhr = new XMLHttpRequest();

                } 

                else {//Pour avant ie7

                        try {

                                xhr = new ActiveXObject("Msxml2.XMLHTTP");

                        } catch(e) {

                                xhr = new ActiveXObject("Microsoft.XMLHTTP");

                        }

                }

        }

        else {//Pour le vieux navigateurs ou s&eacute;curite

                alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");

                return;

        }

     

     xhr.open("GET", "boxes.php?noeud=" + noeud +"", true);//Envoi de la requete au serveur par la methode get.

       xhr.send(null);

        xhr.onreadystatechange = function() { //Fonction anonyme
                if(xhr.readyState 4 && (xhr.status 200 || xhr.status == 0)) {//Reception de la reponse du script php

                       box=xhr.responseText;

                       if(box=="erreur"){

                    alert('Erreur lors de la requete Ajax!');

                       }
                }

        }

        return box;   

}

function verif4(noeud){
if(document.getElementById('branche-'+noeud).checked){
//Ajout d'une action, requete ajax a prevoir pour afficher les touches possibles

box=boxAjax(noeud);

document.getElementById('addbranche-'+noeud).innerHTML='Ajouter les branches : '+box;
}
else{
document.getElementById('addbranche-'+noeud).innerHTML='';
}
}

taillecrayon · Accepted Answer

Salut, j'ai eu le même problème avec le troisième paramètre de xhr.open à true : dans ce cas le prog continuait alors que xhr.response.Text n'était pas arrivé . Dans la mesure ou ça dérange pas ton prog, fais un essai avec false.
taillecrayon

cs_bultez · Answer

bonjour, si au moins ( !! ) on avait et le paragraphe en question et comment est appelé la fonction verif4.... ça nous éviterait et de les taper et de faire différent de ce que tu fais. pas 26895751 lignes non plus ! pas toute tes pages ! uniquement le nécessaire, pas plus ! la page php, ça va aller, on va faire

Cordialement Bul [mon Site] [M'écrire]

rombar · Answer

Salut, en ce qui concerne le code html, il est on ne peut plus simple: Pour l'appel de la fonction verif4 Ajouter une branche Pour la réponse:
A noter que le code php est long(50 lignes de code) et compliqué avec plusieurs requêtes SQL. @taillecrayon: Pour le coup du false, je vais tester cet après-midi. Je vous tiens au courant.

rombar · Answer

Salut!
J'ai résolu mon problème grâce à taillecrayon.
En effet, le fait de mettre false dans xhr.reponse entraîne que le requête est synchrone c'est à dire que le script attend la réponse du serveur pour continuer. Donc dans la théorie, ma variable box contient bien ce résultat en sortant de la fonction boxAjax et ce du premier coup.

Pourquoi dans la théorie? Dans la pratique, il faut changer plus de code que cela car firefox n'éxecute plus xhr.onreadystatechange lors de requêtes synchrones.

Il faut donc tout enlever et remplacer simplement par box=xhr.responseText; Parce que le script continu que si l'état du listener est à 4. Donc aucun risque de bug. S'il y en a un, tout le script plante.

En résumé, voici le code maintenant:

function boxAjax(noeud){
    var box=null;
    var xhr;
        if(window.XMLHttpRequest || window.ActiveXObject) {
                if(window.XMLHttpRequest) {//instanciation de la requete
                        xhr = new XMLHttpRequest();
                } 
                else {//Pour avant ie7
                        try {
                                xhr = new ActiveXObject("Msxml2.XMLHTTP");
                        } catch(e) {
                                xhr = new ActiveXObject("Microsoft.XMLHTTP");
                        }
                }
        }
        else {//Pour le vieux navigateurs ou s&eacute;curite
                alert("Votre navigateur ne supporte pas l'objet XMLHTTPRequest...");
                return;
        }
     
     xhr.open("GET", "boxes.php?noeud=" + noeud +"",false);//Envoi de la requete au serveur par la methode get et synchrone
          xhr.send(null);
    
    box=xhr.responseText; //Le "truc nouveau"
        
        return box;
    
}

cs_bultez · Answer

effectivement, il a l'oeil notre taillecrayon.
le 3ème paramètre détermine si la requête est synchone ou asynchrone
si c'est synchone, le onreadystatechange n'est pas valide.
<hr />
                Cordialement            Bul         [mon Site]     [M'écrire]

taillecrayon · Answer

Salut Bultez, en fait j'avais eu exactement le même pb : 
passer 2 fois par le prog pour récupérer xhr.responseText
et je n'ai eu besoin que du titre du post pour ma suggestion.
Si ça avait été 3 fois alors là...
taillecrayon

Doit faire XMLHttpRequest deux fois avant affichage du résultat

6 réponses

Votre réponse

Discussions similaires