Script AJAX qui ne s’exécute qu'une seul fois.
Résolu
Val_3990
Messages postés
21
Date d'inscription
Statut
Membre
Dernière intervention
-
Val_3990 Messages postés 21 Date d'inscription Statut Membre Dernière intervention -
Val_3990 Messages postés 21 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je suis entrain de réaliser un chat dynamique en utilisant AJAX :

Mon script JS comprend 2 fonction majeur une première qui gère l'envois de message :
Code du fichier php appelé :
Et une fonction qui permet de changer la personne avec la quelle on parle :
Fichier PHP appelé:
Tout cela fonctionne très bien mais qu'une seul fois. J'ai regarder de nombreux poste de forum qui rencontre le même problème mais rien que je n'arrive a comparer a mon code. Je ne comprend pas pourquoi je rencontre ce problème.
Merci d'avance et bonne journée !
Je suis entrain de réaliser un chat dynamique en utilisant AJAX :

Mon script JS comprend 2 fonction majeur une première qui gère l'envois de message :
document.getElementById('bouton').addEventListener('click',function(event){ alert("je rentreeee") console.log("affichagse : "+document.getElementById('areatxt').value) event.preventDefault() msg=document.getElementById('areatxt').value var elem2 = this if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText } HttpRequest.open('POST','monChat.php',true) HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded') HttpRequest.send("msgtxt="+ msg +"&id_customer="+elem2.getAttribute('data-id_customer')) })
Code du fichier php appelé :
<?php session_start(); include('../phpscript/phpfunction.php'); $con=db_connect(); $_SESSION['id_user']=1; $id=$_SESSION['id_user']; //echo ($_GET['message']); ?> <?php $pdo_options[PDO::ATTR_ERRMODE] = PDO::ERRMODE_EXCEPTION; $text=$_POST['msgtxt']; $idCurentUser=($_POST['id_customer']); $id_sup=1; $to='supplier'; $id_custo=($_POST['id_customer']); $date_ad=date('Y-m-d H:i:s'); $data4=array(':Text' => $text,':To' => $to, ':Date_ad' => $date_ad, ':Id_cust' => $id_custo,':Id_supli' => $id_sup); $insertStatement = $con->prepare('INSERT INTO ps_private_message (`message`,`to`,`date_add`,`id_customer`,`id_supplier`) VALUES (:Text,:To,:Date_ad,:Id_cust,:Id_supli)'); $con->BeginTransaction(); try { $insertStatement->execute($data4); } catch (PDOException $e) { echo 'Query failed: ' . $e->getMessage(); } $con->commit(); ?> <?php $check=0; $querry="SELECT DISTINCT name_client FROM client INNER JOIN ps_private_message ON (client.id_client=ps_private_message.id_customer) ORDER BY ps_private_message.date_add;"; $req = $con->query($querry); $querry3="SELECT DISTINCT(id_client),name_client FROM client INNER JOIN ps_private_message ON (client.id_client=ps_private_message.id_customer) ORDER BY ps_private_message.date_add;"; $req3 = $con->query($querry3); ?> <div class="container-fluid h-100"> <div class="row justify-content-center h-100"> <div class="col-md-4 col-xl-3 chat"><div class="card mb-sm-3 mb-md-0 contacts_card"> <div class="card-header"> <div class="input-group"> <input type="text" placeholder="Search..." name="" class="form-control search"> <div class="input-group-prepend"> <span class="input-group-text search_btn"><i class="fas fa-search"></i></span> </div> </div> </div> <div class="card-body contacts_body"> <ul class="contacts"> <?php while ($data3 = $req3->fetch(PDO::FETCH_ASSOC)) { ?> <li class="active"> <a data-id_custo="<?php echo($data3['id_client']); ?>" href="#" class="chat_friend"> <?php echo($data3['id_client']);?> <!---juste pour affiche les id---> <div class="d-flex bd-highlight"> <div class="img_cont"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img"> <span class="online_icon"></span> </div> <div class="user_info"> <span><?php echo ($data3['name_client'])?></span> <p><?php echo(getLastMessage($con,$data3['id_client'])); ?></p> </div> </div> </a> </li> <?php } ?> </ul> </div> <div class="card-footer"></div> </div></div> <div class="col-md-8 col-xl-6 chat"> <div class="card"> <div class="card-header msg_head"> <div class="d-flex bd-highlight"> <div class="img_cont"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img"> <span class="online_icon"></span> </div> <div class="user_info"> <span>Chat with <?php echo (getCurentUserInfo($idCurentUser,$con)) ?></span> <p><?php echo(countMessage($idCurentUser,$con)) ?></p> </div> <div class="video_cam"> <span><i class="fas fa-video"></i></span> <span><i class="fas fa-phone"></i></span> </div> </div> <span id="action_menu_btn"><i class="fas fa-ellipsis-v"></i></span> <div class="action_menu"> <ul> <li><i class="fas fa-user-circle"></i> View profile</li> <li><i class="fas fa-users"></i> Add to close friends</li> <li><i class="fas fa-plus"></i> Add to group</li> <li><i class="fas fa-ban"></i> Block</li> </ul> </div> </div> <div class="card-body msg_card_body"> <div id="testert"> <?php $listeChat=getSpecificMessage($idCurentUser,$con);?> <?php while ($data = $listeChat->fetch(PDO::FETCH_ASSOC)) { ?> <?php if (ISSET($data['file_name'])){ ?> <div class="img_msg"> <div class="d-flex justify-content-start mb-4"> <div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div> <div class="msg_cotainer"> <img style="height:310px; width:390px;" src="<?php echo($data['file_name']); ?>" alt="Probléme d'affichage" /> <span class="msg_time"><?php echo ($data['date_add'])?></span> </div> </div> </div> <?php }else{?> <?php if($data['to']=='customer') { ?> <?php }else{ ?> <div class="d-flex justify-content-end mb-4"> <div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div> <div class="msg_cotainer_send"> <?php echo ($data['message']);?> <span class="msg_time_send"><?php echo ($data['date_add'])?></span> </div> </div> <?php }}} ?> </div> </div> <div class="card-footer"> <form action="#" method="POST "ENCTYPE="multipart/form-data"> <div class="input-group"> <div class="input-group-append"> <span class="input-group-text attach_btn"><i class="fas fa-paperclip"></i></span> </div> <textarea name="msg_txt" id="areatxt" class="form-control type_msg" data-id_customer=<?php echo($idCurentUser); ?> placeholder="Type your message..."></textarea> <div class="input-group-append"> <button type="submit" id="bouton" class="input-group-text send_btn"><i class="fas fa-location-arrow"></i></button> </div> </div> </form> </div> </div> </div> </div> </div>
Et une fonction qui permet de changer la personne avec la quelle on parle :
for(var i=0;i<links.length;i++){ var linkIndex=links[i] linkIndex.addEventListener('click', function(event){ id_custo=linkIndex.getAttribute('value') event.preventDefault() var elem = this if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText } HttpRequest.open('POST','monChat2.php',true) HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded') HttpRequest.send('id_customer='+ elem.getAttribute('data-id_custo')) }) }
Fichier PHP appelé:
<?php session_start(); include('../phpscript/phpfunction.php'); $con=db_connect(); $_SESSION['id_user']=1; $id=$_SESSION['id_user']; $id_cli=($_POST['id_customer']); $idCurentUser=$id_cli; echo("id transmis en param =".$id_cli); $querry="SELECT DISTINCT(id_client),name_client FROM client INNER JOIN ps_private_message ON (client.id_client=ps_private_message.id_customer) ORDER BY ps_private_message.date_add;"; $req = $con->query($querry); $querry2="SELECT * FROM `ps_private_message` WHERE (`id_supplier`=('$id')) AND `id_customer`=('$id_cli');"; $req2 = $con->query($querry2); ?> <div class="container-fluid h-100"> <div class="row justify-content-center h-100"> <div class="col-md-4 col-xl-3 chat"><div class="card mb-sm-3 mb-md-0 contacts_card"> <div class="card-header"> <div class="input-group"> <input type="text" placeholder="Search..." name="" class="form-control search"> <div class="input-group-prepend"> <span class="input-group-text search_btn"><i class="fas fa-search"></i></span> </div> </div> </div> <div class="card-body contacts_body"> <ul class="contacts"> <?php while ($data3 = $req->fetch(PDO::FETCH_ASSOC)) { ?> <li class="active"> <a data-id_custo="<?php echo($data3['id_client']); ?>" href="#" class="chat_friend"> <?php echo($data3['id_client']);?> <!---juste pour affiche les id---> <div class="d-flex bd-highlight"> <div class="img_cont"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img"> <span class="online_icon"></span> </div> <div class="user_info"> <span><?php echo ($data3['name_client'])?></span> <p><?php echo(getLastMessage($con,$data3['id_client'])); ?></p> </div> </div> </a> </li> <?php $check=1; } ?> </ul> </div> <div class="card-footer"></div> </div></div> <div class="col-md-8 col-xl-6 chat"> <div class="card"> <div class="card-header msg_head"> <div class="d-flex bd-highlight"> <div class="img_cont"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img"> <span class="online_icon"></span> </div> <div class="user_info"> <span>Chat with <?php echo (getCurentUserInfo($idCurentUser,$con)) ?></span> <p><?php echo(countMessage($idCurentUser,$con)) ?></p> </div> <div class="video_cam"> <span><i class="fas fa-video"></i></span> <span><i class="fas fa-phone"></i></span> </div> </div> <span id="action_menu_btn"><i class="fas fa-ellipsis-v"></i></span> <div class="action_menu"> <ul> <li><i class="fas fa-user-circle"></i> View profile</li> <li><i class="fas fa-users"></i> Add to close friends</li> <li><i class="fas fa-plus"></i> Add to group</li> <li><i class="fas fa-ban"></i> Block</li> </ul> </div> </div> <div class="card-body msg_card_body"> <div id="testert"> <?php $listeChat=getSpecificMessage($idCurentUser,$con);?> <?php while ($data = $listeChat->fetch(PDO::FETCH_ASSOC)) { ?> <?php if (ISSET($data['file_name'])){ ?> <div class="img_msg"> <div class="d-flex justify-content-start mb-4"> <div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div> <div class="msg_cotainer"> <img style="height:310px; width:390px;" src="<?php echo($data['file_name']); ?>" alt="Probléme d'affichage" /> <span class="msg_time"><?php echo ($data['date_add'])?></span> </div> </div> </div> <?php }else{?> <?php if($data['to']=='customer') { ?> <?php }else{ ?> <div class="d-flex justify-content-end mb-4"> <div class="img_cont_msg"> <img src="https://static.turbosquid.com/Preview/001292/481/WV/_D.jpg" class="rounded-circle user_img_msg"> </div> <div class="msg_cotainer_send"> <?php echo ($data['message']);?> <span class="msg_time_send"><?php echo ($data['date_add'])?></span> </div> </div> <?php }}} ?> </div> </div> <div class="card-footer"> <form action="#" method="POST "ENCTYPE="multipart/form-data"> <div class="input-group"> <div class="input-group-append"> <span class="input-group-text attach_btn"><i class="fas fa-paperclip"></i></span> </div> <textarea name="msg_txt" id="areatxt" class="form-control type_msg" placeholder="Type your message..."></textarea> <div class="input-group-append"> <button type="submit" id="bouton" data-id_customer="<?php echo($idCurentUser); ?>" class="input-group-text send_btn"><i class="fas fa-location-arrow"></i></button> </div> </div> </form> </div> </div> </div> </div> </div> <script type="text/javascript" src="../js/interface4.js"></script>
Tout cela fonctionne très bien mais qu'une seul fois. J'ai regarder de nombreux poste de forum qui rencontre le même problème mais rien que je n'arrive a comparer a mon code. Je ne comprend pas pourquoi je rencontre ce problème.
Merci d'avance et bonne journée !
A voir également:
- Script AJAX qui ne s’exécute qu'une seul fois.
- Script vidéo youtube - Guide
- Mas script - Accueil - Windows
- Comment imprimer un tableau excel sur une seule page - Guide
- Paiement 4 fois cdiscount impossible - Forum Consommation & Internet
- Volume qui augmente tout seul xiaomi - Forum Jeux vidéos smartphones
8 réponses
Bonjour,
Dans ton cas, tu retournes le code html de ta page... et donc, l'event n'est pas réinitialisé sur le "bouton"...
A savoir qu'en Ajax on évite de retourner du HTML ....
On ne retourne que les données "brute" ( au format JSON de préférence), et ensuite, c'est le javascript qui s'occupe de créer le html avec ces données....
Voici quelques exemples : (qui utilisent jquery.. )
https://codes-sources.commentcamarche.net/source/102253-exemple-ajax-en-jquery
Dans ton cas, tu retournes le code html de ta page... et donc, l'event n'est pas réinitialisé sur le "bouton"...
A savoir qu'en Ajax on évite de retourner du HTML ....
On ne retourne que les données "brute" ( au format JSON de préférence), et ensuite, c'est le javascript qui s'occupe de créer le html avec ces données....
Voici quelques exemples : (qui utilisent jquery.. )
https://codes-sources.commentcamarche.net/source/102253-exemple-ajax-en-jquery
Merci beaucoup pour le liens,
J'avoue que j'ai un peu de mal a y comprendre quelque chose (j'ai un niveau en informatique qui se limite relativement a ce que j'ai montrer), et pour ce qui est du Json j'avais déjà prévu de faire le changement mais j'aimerai (dans l'idéal) avoir une autre version de mon projet pour le Json (principalement pour avoir une base solide d'exemple pour de futur projet que j'ai en tête).
Pour ce qui est de mon code, a quelle niveau es que je "retourne" le code html (innerHtml je suppose ou alors pendant l'appel a send) ?
Et est-t-il possible de contourner cela sans avoir a transférer mes données au format Json ?
Merci d'avance et bonne après-midi.
J'avoue que j'ai un peu de mal a y comprendre quelque chose (j'ai un niveau en informatique qui se limite relativement a ce que j'ai montrer), et pour ce qui est du Json j'avais déjà prévu de faire le changement mais j'aimerai (dans l'idéal) avoir une autre version de mon projet pour le Json (principalement pour avoir une base solide d'exemple pour de futur projet que j'ai en tête).
Pour ce qui est de mon code, a quelle niveau es que je "retourne" le code html (innerHtml je suppose ou alors pendant l'appel a send) ?
Et est-t-il possible de contourner cela sans avoir a transférer mes données au format Json ?
Merci d'avance et bonne après-midi.
a quelle niveau es que je "retourne" le code html
ben.. dans le "Fichier PHP appelé:"
tout ce qui se trouve après la ligne 15 ....
et donc... ton script ne devrais retourner que les données de tes requêtes dans un array encodé au format JSON
et dans le code JS de ta page principale.. traiter cet array pour générer le code html de ta page
Merci pour la réponse,
Oui j'ai bien comprit que je devais générer mon code HTML a partir de données JSON et j'ai en effet prévu de le faire, cependant actuellement je ne vois pas en quoi cela changerai quelque chose a mon problème.
Quand je demandais a quelle niveau était retourner mon code html je me demandais plutôt a quelle moment es que je rendais mes eventListener inutilisable de façon a essayer de contourner temporairement le problème.
Oui j'ai bien comprit que je devais générer mon code HTML a partir de données JSON et j'ai en effet prévu de le faire, cependant actuellement je ne vois pas en quoi cela changerai quelque chose a mon problème.
Quand je demandais a quelle niveau était retourner mon code html je me demandais plutôt a quelle moment es que je rendais mes eventListener inutilisable de façon a essayer de contourner temporairement le problème.
Ben ici
Le plus simple étant de réécrire le code sous la forme:
if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText // Ici .. tu dois "récactiver" ton eventlistener }
Le plus simple étant de réécrire le code sous la forme:
function initBtn(){ document.getElementById('bouton').addEventListener('click',function(event){ mafonction(); }); } function mafonction(){ alert("je rentreeee") var HttpRequest = getHttpRequest() console.log("affichagse : ", document.getElementById('areatxt').value) event.preventDefault() var msg = document.getElementById('areatxt').value var elem2 = this if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText initBtn(); } HttpRequest.open('POST','monChat.php',true) HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded') HttpRequest.send("msgtxt="+ msg +"&id_customer="+elem2.getAttribute('data-id_customer')) } //initialisation du bouton pour la premiere fois : initBtn();
J'ai essayer de récupérer ce code mais j'ai eu un problème avec la fonction getAttribut. J'ai lue que de nombreuse personne avait eu ce probléme et la réponse qui revenait majotiraiment disais que l'objet visé était un objet jQuerry et non DOM.
Je ne pense pas faire face a ce probléme car le simple fait de déplacer un peu de code dans une fonction ne va pas changer le type d'un objet (enfin je pense).
J'ai tout de même essayer de changer un peu le code pour obtenir ca :
Mais cette fois-ci mon affichage de elem2.data() affiche undifined.
J'avoue que je suis pas mal perdue même si j'ai comprit l'idée de base je ne comprend pas pourquoi elle engendre de tel modification.
Je ne pense pas faire face a ce probléme car le simple fait de déplacer un peu de code dans une fonction ne va pas changer le type d'un objet (enfin je pense).
J'ai tout de même essayer de changer un peu le code pour obtenir ca :
function sendMsg(){ alert("je rentreeee") var HttpRequest = getHttpRequest() console.log("affichagse : "+document.getElementById('areatxt').value) event.preventDefault() var msg=document.getElementById('areatxt').value var elem2 = $(this) if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText initBtn(); } HttpRequest.open('POST','monChat.php',true) HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded') console.log("affichage :"+elem2.data('id_customer')) HttpRequest.send("msgtxt="+ msg +"&id_customer="+elem2.data('id_customer')) }
function initBtn(){ document.getElementById('bouton').addEventListener('click',function(event){ sendMsg(); }); }
Mais cette fois-ci mon affichage de elem2.data() affiche undifined.
J'avoue que je suis pas mal perdue même si j'ai comprit l'idée de base je ne comprend pas pourquoi elle engendre de tel modification.
Je n'avais pas fais gaffe à cette variable elm2
donc le code devrait ressembler à un truc du genre :
Par contre... vu que tu sembles avoir du jquery dans ta page... pourquoi ne pas écrire ton code avec cette librairie ??
ça serait plus propre...
Au lieu de faire xmlhttprequest ... fais donc du $.Ajax
Et au lieu de faire du addEventListener .. faire du
donc le code devrait ressembler à un truc du genre :
function initBtn(){ document.getElementById('bouton').addEventListener('click',function(event){ event.preventDefault() var elem2 = $(this) mafonction(elem2); }); } function sendMsg(elem2){ alert("je rentreeee"); var HttpRequest = getHttpRequest(); console.log("affichagse : "+document.getElementById('areatxt').value) var msg=document.getElementById('areatxt').value; if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText; initBtn(); } HttpRequest.open('POST','monChat.php',true); HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded'); console.log("affichage " , elem2.data('id_customer')); HttpRequest.send("msgtxt="+ msg +"&id_customer="+elem2.data('id_customer')); } //initialisation du bouton pour la premiere fois : initBtn();
Par contre... vu que tu sembles avoir du jquery dans ta page... pourquoi ne pas écrire ton code avec cette librairie ??
ça serait plus propre...
Au lieu de faire xmlhttprequest ... fais donc du $.Ajax
Et au lieu de faire du addEventListener .. faire du
$('#bouton').click(function(){ ...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
En effet cela fonctionne bien et oui en effet quasiment tout les postes que j'ai lue écrit par des gens qui essayait de faire des choses semblables au mienne utilise cette librairie.
Dernier problème et après je te jure que je te laisse tranquille :').
J'ai essayé de faire la même chose pour pour autre fonction :
Cette fois ci la requette AJAX a bien lieu et me retourne bien le code que je souhaite mais la condition :
if(HttpRequest.readyState == 4 &HttpRequest.status == 200)
ne se valide jamais alors que son status est bien affiché a 200 dans le naviguatteur,
comme je ne sais pas comment on contrôle le "readyState" je l'ai simplement enlever et malgrès tout rien...
Désoler de te poser autant de question et merci encore pour tes réponses.
Dernier problème et après je te jure que je te laisse tranquille :').
J'ai essayé de faire la même chose pour pour autre fonction :
function changeCustomer(elem){ var HttpRequest = getHttpRequest() if(HttpRequest.readyState == 4 &HttpRequest.status == 200) { console.log("je suis la") document.getElementById('changeCusto').innerHTML = HttpRequest.responseText initChangeCusto(); } HttpRequest.open('POST','monChat2.php',true) HttpRequest.setRequestHeader('Content-Type','application/x-www-form-urlencoded') HttpRequest.send('id_customer='+ elem.data('id_custo')) }
function initChangeCusto(){ var links = document.querySelectorAll('.chat_friend') for(var i=0;i<links.length;i++){ var linkIndex=links[i] linkIndex.addEventListener('click', function(event){ var elem = $(this) event.preventDefault() changeCustomer(elem) }); } }
Cette fois ci la requette AJAX a bien lieu et me retourne bien le code que je souhaite mais la condition :
if(HttpRequest.readyState == 4 &HttpRequest.status == 200)
ne se valide jamais alors que son status est bien affiché a 200 dans le naviguatteur,
comme je ne sais pas comment on contrôle le "readyState" je l'ai simplement enlever et malgrès tout rien...
Désoler de te poser autant de question et merci encore pour tes réponses.
Là non plus je n'avais pas relu ton code....
le "and" .. c'est avec 2 &
donc
Ah.. et il serait bien également de finir (comme dans les codes que je te donne....) tes instructions par des point-virgules !
Certains navigateurs pourraient ne pas apprécier cet oubli dans tes codes ....
le "and" .. c'est avec 2 &
donc
if(HttpRequest.readyState == 4 && HttpRequest.status == 200) {
Ah.. et il serait bien également de finir (comme dans les codes que je te donne....) tes instructions par des point-virgules !
Certains navigateurs pourraient ne pas apprécier cet oubli dans tes codes ....
Il me semble que les 2 syntaxes sont acceptés pour le and (certainement plus tolérer qu'accepter), en tout cas ça ne résous pas le problème.
Je viens de faire quelque test et mon readyState reste bloqué a 0...
Beaucoup de personne on rencontré ce problème mais il était quasiment toujours lié a la fonction onReadyStateChange que je n'utilise pas.
J'avoue que la je suis vraiment pommé.
Beaucoup de personne on rencontré ce problème mais il était quasiment toujours lié a la fonction onReadyStateChange que je n'utilise pas.
J'avoue que la je suis vraiment pommé.
Encore une fois... je n'avais pas relu le code complètement...;
Et donc.. si ! il faut le onreadystatechange....
L'ajax fonctionne en mode asynchrone....
Donc il continue de traiter le code Javascript sans attendre la réponse de ton script php.
Il ne rentrera donc dans ton IF ... que si tu lui demande d'attendre le changement de son statut...
Y'a pas à dire.... je ne supporte de moins en moins l'ajax en "pure" javascript....
Sincèrement... si tu as chargé jquery dans ta page... passe à la syntaxe jquery... tu auras beaucoup moins de soucis !
Et donc.. si ! il faut le onreadystatechange....
HttpRequest.onreadystatechange = function () { if(HttpRequest.readyState == 4 && HttpRequest.status == 200) { document.getElementById('changeCusto').innerHTML = HttpRequest.responseText initChangeCusto(); } }
L'ajax fonctionne en mode asynchrone....
Donc il continue de traiter le code Javascript sans attendre la réponse de ton script php.
Il ne rentrera donc dans ton IF ... que si tu lui demande d'attendre le changement de son statut...
Y'a pas à dire.... je ne supporte de moins en moins l'ajax en "pure" javascript....
Sincèrement... si tu as chargé jquery dans ta page... passe à la syntaxe jquery... tu auras beaucoup moins de soucis !
var url = "monChat2.php"; var datas = { id_customer: elem.data('id_custo') }; $.ajax({ //L'URL de la requête url: url, method: "POST", dataType : "json", data:datas }) //Ce code sera exécuté en cas de succès - La réponse du serveur est passée à done() .done(function(response){ console.log('reponse ajax',response); document.getElementById('changeCusto').innerHTML = response initChangeCusto(); }) //Ce code sera exécuté en cas d'échec - L'erreur est passée à fail() .fail(function(error){ alert("La requête s'est terminée en échec. Infos : " + JSON.stringify(error)); }) });