11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour à tous,

J'ai créé plusieurs scripts php appelés en Ajax grâce à jQuery. Les requêtes PHP se font très bien, seulement, les DIV concernées se rechargent parfois avant que le script ne soit terminé, ce qui a pour effet de ne pas mettre à jour l'affichage, alors que le script s'est pourtant bien déroulé.

Un petit exemple :
Par exemple, lorsque je souhaite mettre un article hors ligne (je fais un cms), un bouton vert doit devenir rouge. Mais parfois, alors que la mise à jour s'est effectuée dans la BDD, mon bouton reste vert. Si je recharge la page, il devient bien rouge.

Le code :

       function statut(etat){
              $.get("mod/mod_pages/js/ajax-changer-statut.php", { statut: etat } );
              $("#liste").load(location.href+" #liste");
       }


J'en conclus que la DIV s'est rechargée trop tôt, et j'ai beau chercher, je ne trouve pas comment on peut forcer le script à attendre que la requête soit terminée pour recharger la DIV.

Merci d'avance Smiley smile
regarde un peu la doc de jQuery (que je n'utilise pas), il y a forcément un moyen de rajouter un callback à ton appel AJAX. Le callback est une fonction qui s'éxécute lorsque quelque chose est fini
Alors je me suis renseigné sur les callback, j'ai désormais ce code :


function statut(etat){
$.get("mod/mod_pages/js/ajax-changer-statut.php", { statut: etat } ), function() {
                     $("#liste").load(location.href+" #liste");
               )};  
       }
 


Mais ce code ne fonctionne pas. Est-ce que j'oublie quelque chose ?
Modifié par maGriffe (28 Jul 2010 - 13:26)
La fonction setTimeout répond à peu près à ce que je souhaitais, même si le rechargement est ici après une durée fixe.

Voici mon code désormais, si ça peut aider quelqu'un :

       function statut(etat){
              $.get("mod/mod_contacts/js/ajax-changer-statut.php", { statut: etat } );
              setTimeout(function () { $("#liste").load(location.href+" #liste") }, 500);
       }


Et si quelqu'un a une meilleure idée, je suis preneur Smiley smile
Modifié par maGriffe (28 Jul 2010 - 13:48)
Hello,
maGriffe a écrit :
Alors je me suis renseigné sur les callback, j'ai désormais ce code :


function statut(etat){
$.get("mod/mod_pages/js/ajax-changer-statut.php", { statut: etat } ), function() {
                     $("#liste").load(location.href+"#liste");
               )};  
       }


Mais ce code ne fonctionne pas. Est-ce que j'oublie quelque chose ?

C'est la bonne base. Il semble néanmoins que tu aies un petit problème de parenthèses. Il faudrait écrire ceci :
function statut(etat) {
  $.get("mod/mod_pages/js/ajax-changer-statut.php", {statut: etat}, function() {
    $("#liste").load(location.href + "#liste");
  });  
}

Modifié par Julien Royer (28 Jul 2010 - 14:24)
Soit dit en passant, peut-être peux-tu te débrouiller pour ne faire qu'une requête, qui modifie l'état et te renvoie le code HTML ? Cela t'éviterait le problème décrit ici.
Ha super ça marche impeccable !

Mais je ne vois pas la différence avec mon ancien code ?

Bon déjà si ça marche comme ça c'est très bien, je me pencherai plus tard vers une solution avec une seule requête Smiley smile

Merci beaucoup !