2010-07-22 3 views
26

Basé sur: Abort Ajax requests using jQuery ... Dans inventory_search() - avant que la requête ajax ne soit faite, comment puis-je vérifier les demandes en cours et les abandonner() avant de faire une nouvelle requête? Ou ... Y a-t-il une meilleure façon de faire cela?jquery abort() requête ajax avant d'en envoyer une autre

<script type="text/javascript"> 

    $(function() { 
     $('form#internal_catalog').change(function() { 
      inventory_search(); 
     }); 
    }); 

    function inventory_search() { 
     var search_data = $('form#internal_catalog').serialize(); 
     var a = $.ajax({ 
      type: 'post', 
      url: '/test.php', 
      data: search_data, 
      success: function(data) { 
       $('#catalog').html(data); 
      } 
     }); 
    } 

</script> 

Répondre

61

Créer une file d'attente de tableau de toutes vos demandes. Ensuite, si vous trouvez un point où vous devez annuler toutes les demandes existantes, vous pouvez simplement faire une boucle dans le tableau et appeler abort sur toutes les demandes en attente. Devrait être assez simple. Bien que l'autre façon est de simplement garder un drapeau interne qui indique si une demande est actuellement en cours et ignorer la demande s'il y en a un. Ou gérer la façon dont vous le souhaitez.

EDIT: Cochez cette question SO pour une situation similaire: How to avoid 3 ajax calls?

EDIT 2: Je ce que vous pouvez faire est d'avoir un tableau que vous ajoutez tous vos ajax appels. Ce qui consiste essentiellement à faire un XmlHttpRequest et c'est ce qui est retourné par l'appel ajax. Donc

requests.push(
    $.ajax({ 
     type: 'post', 
     url: '/test.php', 
     data: search_data, 
     success: function(data) { 
      $('#catalog').html(data); 
     } 
    })); 

Ceci ajoutera toutes vos demandes à un tableau de requêtes que vous pouvez définir quelque part. Ensuite, quand vous voulez tuer toutes les requêtes en attente, vous pouvez simplement faire une boucle dans le tableau et appeler abort ce qui va tuer la requête. Ou simplement définir une variable en dehors de votre fonction qui est un indicateur indiquant si une requête est en cours. Vous pouvez même le rendre plus spécifique et stocker les données de recherche et seulement ignorer les demandes qui ont une demande en attente pour les mêmes données et autoriser d'autres demandes qui sont pour des données différentes.

Espérons que cela soit suffisant pour vous aider à démarrer.

2

Utilisez une variable globale pour contenir le handle de la requête en cours. Dans ce cas, déclarez le var a à l'extérieur de la fonction et rendez-le global. Avant d'appeler le contrôle ajax, il n'est pas nul. Si ce n'est pas le cas abort, il l'attribue avec un nouvel ajax. Dans l'événement succès/complet, assurez-vous d'effacer la variable a. Peut ne pas être la meilleure solution là-bas, mais fonctionne mieux.

4

Assez facile avec jQuery AjaxManager Plugin:

$.manageAjax.create('unique_identifier',{ 
queue:'clear',cacheResponse:false,maxRequests:1,abortOld:true 
}); 
jQuery.manageAjax.abort('unique_identifier'); 
jQuery.manageAjax.clear('unique_identifier'); 
jQuery.manageAjax.add('unique_identifier',{success: function(data) {}}); 
23

réponse de Spinon est idéal pour toutes les requêtes ajax abandon, mais pas super pour garder une trace d'un seul.

je trouve faire moi-même souvent quelque chose comme

var ajax_request; 
function do_something() 
{ 
    if(typeof ajax_request !== 'undefined') 
     ajax_request.abort(); 
    ajax_request = $.ajax({ 
     type: 'post', 
     url: '/test.php', 
     data: search_data, 
     success: function(data) { 
      $('#catalog').html(data); 
     } 
    }); 
} 
+1

+1 je le fais en utilisant exactement la même méthode. (sauf le nom de variable 'ajax_request' ^^) ... Et ça marche bien! – JoDev

+0

Je viens de changer 'var ajax_request;' à 'var ajax_request = new XMLHttpRequest();' et ça marche. +1 pour l'idée – smartrahat

Questions connexes