¿Detener las sumisiones duplicadas de Ajax?

Question

Me pregunto ¿cuál es la mejor manera de detener las presentaciones duplicadas al usar jquery y ajax?

llego a tener 2 formas posibles, pero no está seguro de si se trata de la única 2.

1. El Ajax bloquea Marcha todos los botones hasta que se realiza la solicitud. 2 problemas que veo con esto es que utilizo el diálogo de modelo de jquery, así que no sé cuán fácil sería desactivar esos botones, ya que no estoy seguro de si tienen id. Segundo, si la solicitud se bloquea, el usuario realmente no tiene forma de volver a intentarlo ya que todos los botones están desactivados.

2. Estoy buscando algo llamado AjaxQueue en este momento No tengo ni idea de si es lo que necesito o cómo funciona desde el sitio donde aparentemente el plugin está fuera de servicio por mantenimiento.

http://docs.jquery.com/AjaxQueue

Editar

Creo que este es un spin off de lo que estaba viendo.

http://www.protofunc.com/scripts/jquery/ajaxManager/

El único problema que veo con este ajaxManager es que creo que tengo que cambiar todos mis seres $ .post, .Consulte $ y $ .ajax a su tipo.

Pero, ¿qué sucede si necesito un parámetro especial de $ .ajax? O ese hecho me gusta usar .post y .get.

Editar 2

creo que puede tomar en todas las opciones $ .ajax. Todavía estoy investigando. Sin embargo, de lo que no estoy seguro ahora es si puedo usar el mismo constructor para todas las solicitudes que utilizarán las mismas opciones.

First you have to construct/configure a new Ajaxmanager 
//create an ajaxmanager named someAjaxProfileName 
var someManagedAjax = $.manageAjax.create('someAjaxProfileName', { 
    queue: true, 
    cacheResponse: true 
}); 

¿O tengo que hacer lo anterior todas las veces?

Answer 1

¿Qué le parece establecer una marca cuando el usuario hace clic en el botón? Solo borrará el indicador cuando la solicitud AJAX se complete con éxito (en complete, que se llama después de las devoluciones de llamadas success y error), y solo enviará una solicitud AJAX si el indicador no está configurado.

En relación con la cola de AJAX hay un complemento llamado jQuery Message Queuing que es muy bueno. Lo he usado yo mismo.

var requestSent = false; 

jQuery("#buttonID").click(function() { 
    if(!requestSent) { 
     requestSent = true; 

     jQuery.ajax({ 
     url: "http://example.com", 
     ...., 
     timeout: timeoutValue, 
     complete: function() { 
      ... 
      requestSent = false; 
     }, 
     }); 
    } 
}); 

Se puede establecer un valor de tiempo de espera para las solicitudes de larga duración (el valor es en milisegundos) si piensa que su solicitud tiene una posibilidad de colgar. Si se produce un tiempo de espera, se llama a la devolución de llamada error, después de la cual se llama a la devolución de llamada complete.

Answer 2

Puede almacenar una solicitud activa en una variable, luego desactívela cuando haya una respuesta.

var request; // Stores the XMLHTTPRequest object 

$('#myButton').click(function() { 
    if(!request) { // Only send the AJAX request if there's no current request 

     request = $.ajax({ // Assign the XMLHTTPRequest object to the variable 
      url:..., 
      ..., 
      complete: function() { request = null } // Clear variable after response 
     }); 

    } 
}); 

EDIT:

Lo bueno de esto, es que se podría cancelar solicitudes de larga ejecución utilizando abort().

var request; // Stores the XMLHTTPRequest object 
var timeout; // Stores timeout reference for long running requests 

$('#myButton').click(function() { 
    if(!request) { // Only send the AJAX request if there's no current request 

     request = $.ajax({ // Assign the XMLHTTPRequest object to the variable 
      url:..., 
      ..., 
      complete: function() { timeout = request = null } // Clear variables after response 
     }); 

     timeout = setTimeout(function() { 
         if(request) request.abort(); // abort request 
        }, 10000);       // after 10 seconds 

    } 
}); 

Answer 3

$.xhrPool = {}; 
$.xhrPool['hash'] = [] 
$.ajaxSetup({ 
    beforeSend: function(jqXHR,settings) { 
     var hash = settings.url+settings.data 
     if ($.xhrPool['hash'].indexOf(hash) === -1){ 
      jqXHR.url = settings.url; 
      jqXHR.data = settings.data; 
      $.xhrPool['hash'].push(hash); 
     }else{ 
      console.log('Duplicate request cancelled!'); 
      jqXHR.abort(); 
     } 
    }, 
    complete: function(jqXHR,settings) { 
     var hash = jqXHR.url+jqXHR.data 
      if (index > -1) { 
       $.xhrPool['hash'].splice(index, 1); 
      } 
     } 
    });