Arrêter les soumissions Ajax en double?

Question

Je me demande quelle est la meilleure façon d'arrêter les soumissions dupliquées en utilisant jquery et ajax?

Je viens avec 2 façons possibles, mais pas sûr que ce sont les seuls 2.

1. sur Ajax désactiver tous les boutons commencent à la demande est faite. 2 problèmes que je vois avec ceci cependant j'utilise la boîte de dialogue de modèle de jquery ainsi je ne sais pas comment il serait facile de désactiver ces bouton car je ne sais pas s'ils ont des identifiants. Deuxième je si la demande se bloque l'utilisateur n'a vraiment aucun moyen d'essayer à nouveau puisque tous les boutons sont désactivés. Je suis à la recherche de quelque chose appelé AjaxQueue en ce moment je n'ai aucune idée si c'est ce dont j'ai besoin ou comment cela fonctionne depuis le site où le plugin est apparemment en panne pour la maintenance.

http://docs.jquery.com/AjaxQueue

Modifier

Je pense que c'est un spin off de ce que je regardais.

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

Le seul problème que je vois avec ce ajaxManager est que je pense que je dois changer tous mes $ .post, $ .get et .ajax $ ceux de leur type.

Mais que se passe-t-il si j'ai besoin d'un paramètre spécial de $ .ajax? Ou ce fait j'aime utiliser .post et .get.

Edit 2

Je pense qu'il peut prendre dans toutes les .ajax $ options. Je suis toujours en train de regarder ça. Cependant, ce dont je ne suis pas sûr maintenant, c'est si je peux utiliser le même constructeur pour toutes les demandes qui utiliseront les mêmes options.

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

Ou dois-je faire ce qui précède à chaque fois?

Answer 1

Comment définir un indicateur lorsque l'utilisateur clique sur le bouton? Vous effacerez seulement le drapeau quand la demande d'AJAX réussit (dans complete, qui est appelé après les rappels success et error), et vous enverrez seulement une demande d'AJAX si l'indicateur n'est pas placé.

Relatif à la mise en file d'attente AJAX, il existe un plugin appelé jQuery Message Queuing qui est très bon. Je l'ai utilisé moi-même.

var requestSent = false; 

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

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

Vous pouvez définir une valeur de délai d'attente pour les demandes de longue durée (valeur est en millisecondes) si vous pensez que votre demande a une possibilité d'accrocher. Si un délai d'expiration se produit, le rappel error est appelé, après quoi le rappel complete est appelé.

Answer 2

Vous pouvez stocker une requête active dans une variable, puis l'effacer en cas de réponse.

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:

Une bonne chose à ce sujet, est que vous pouvez annuler les demandes de longue course en utilisant 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); 
      } 
     } 
    });