2010-07-22 31 views
26

Basado en: Abort Ajax requests using jQuery ... In inventory_search() - antes de realizar la solicitud ajax, ¿cómo puedo verificar las solicitudes actuales y abortarlas antes de realizar una nueva solicitud? O ... ¿Hay una mejor manera de hacer esto?jquery abort() solicitud ajax antes de enviar otra

<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> 

Respuesta

61

Crea una cola de conjunto de todas tus solicitudes. Luego, si encuentra un punto donde debe cancelar todas las solicitudes existentes, puede recorrer el conjunto y cancelar todas las solicitudes pendientes. Debería ser bastante simple.

Aunque la otra forma es simplemente mantener un indicador interno que indica si una solicitud está actualmente en proceso y omitir la solicitud, si la hay. O maneja cómo te parezca.

EDIT: Marque esta cuestión de forma para una situación similar: How to avoid 3 ajax calls?

EDIT 2: Así que lo que puede hacer es tener una matriz que anexar todas sus llamadas Ajax. Que es esencialmente solo hacer una solicitud XmlHttp y eso es lo que se devuelve desde la llamada ajax. Así

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

Esto agregará todas sus peticiones a un conjunto de peticiones que puede definir en alguna parte. Luego, cuando quiera eliminar todas las solicitudes pendientes, puede recorrer el conjunto y llamar a abortar, lo que matará a la solicitud.

for(var i = 0; i < requests.length; i++) 
    requests[i].abort(); 

O simplemente defina una variable fuera de su función que sea una bandera que indique si se está realizando una solicitud. Incluso puede hacerlo más específico y almacenar los datos de búsqueda y solo omitir las solicitudes que tienen una solicitud pendiente para los mismos datos y permitir otras solicitudes que son para datos diferentes.

Espero que eso sea suficiente para comenzar.

2

Utilice una variable global para mantener el control de la solicitud actual. En este caso, declare el var a fuera de la función y hágalo global. Antes de llamar al control Ajax, no es nulo. Si no es nulo abort, de otra forma, asigne el nuevo ajax. En el evento de éxito/completo, asegúrese de borrar la variable a. Puede que no sea la mejor solución, pero funciona mejor.

4

Bastante fácil con 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

respuesta de Spinon es ideal para abortar todas las consultas ajax pero no grandes para hacer el seguimiento de uno solo.

a menudo me encuentro haciendo algo como

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 lo hago utilizando exactamente el mismo método. (excepto el nombre 'ajax_request' var ^^) ... ¡Y funciona bien! – JoDev

+0

Acabo de cambiar 'var ajax_request;' a 'var ajax_request = new XMLHttpRequest();' y funciona. +1 por la idea – smartrahat

Cuestiones relacionadas