Jquery Ajax beforeSend et succès, erreur et complète

J'ai un problème dans la fonction ajax où la sortie avant de la deuxième publication ajax est exécutée avant la fonction complète: du premier ajax. La classe de chargement que j'ajoute au placehorder avant l'envoi fonctionne pour le premier appel ajax. Cependant, peu de temps après la première requête ajax complète, la classe est supprimée et n'ajoute jamais de nouveau sur le deuxième et d'autres appels (rappelez-vous les appels récursifs). Alors que le débogage, il montre que la fonction beforeSend des seconds appels ajax est appelée en premier et la fonction complète du premier appel ajax est appelée plus tard. Ce qui est évident parce que les données de retour insérées dans la page depuis le premier appel ajax commencent le deuxième appel.

En bref, il est mélangé. Y a-t-il un moyen de régler cela?

Le code de fonction est le suivant

function AjaxSendForm(url, placeholder, form, append) { var data = $(form).serialize(); append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only $.ajax({ type: 'POST', url: url, data: data, beforeSend: function() { // setting a timeout $(placeholder).addClass('loading'); }, success: function(data) { if (append) { $(placeholder).append(data); } else { $(placeholder).html(data); } }, error: function(xhr) { // if error occured alert("Error occured.please try again"); $(placeholder).append(xhr.statusText + xhr.responseText); $(placeholder).removeClass('loading'); }, complete: function() { $(placeholder).removeClass('loading'); }, dataType: 'html' }); } 

Et les données contiennent l'extrait suivant de javascript / jquery qui vérifie et lance une autre requête ajax.

 <script type="text/javascript">//<!-- $(document).ready(function() { $('#restart').val(-1) $('#ajaxSubmit').click(); }); //--></script> 

Peut-être que vous pouvez essayer ce qui suit:

 var i = 0; function AjaxSendForm(url, placeholder, form, append) { var data = $(form).serialize(); append = (append === undefined ? false : true); // whatever, it will evaluate to true or false only $.ajax({ type: 'POST', url: url, data: data, beforeSend: function() { // setting a timeout $(placeholder).addClass('loading'); i++; }, success: function(data) { if (append) { $(placeholder).append(data); } else { $(placeholder).html(data); } }, error: function(xhr) { // if error occured alert("Error occured.please try again"); $(placeholder).append(xhr.statusText + xhr.responseText); $(placeholder).removeClass('loading'); }, complete: function() { i--; if (i <= 0) { $(placeholder).removeClass('loading'); } }, dataType: 'html' }); } 

De cette façon, si l'instruction beforeSend si appelée avant l'instruction complete , beforeSend plus de 0 afin de ne pas supprimer la classe. Ensuite, seul le dernier appel pourra l'enlever. Je ne peux pas le tester, laissez-moi savoir si cela fonctionne ou non.

C'est en fait beaucoup plus facile avec l'API prometteuse de jQuery :

 $.ajax( type: "GET", url: requestURL, ).then((success) => console.dir(success) ).failure((failureResponse) => console.dir(failureResponse) ) 

Alternativement, vous pouvez transférer des fonctions de bind à chaque rappel de résultat; L'ordre des paramètres est: (success, failure) . Tant que vous spécifiez une fonction avec au moins 1 paramètre, vous obtenez l'accès à la réponse. Ainsi, par exemple, si vous vouliez vérifier le texte de réponse, vous pouvez simplement:

 $.ajax( type: "GET", url: @get("url") + "logout", beforeSend: (xhr) -> xhr.setRequestHeader("token", currentToken) ).failure((response) -> console.log "Request was unauthorized" if response.status is 401