arrêtant un $ post

Question

J'ai volé/trouvé/utilisé/écrit et édité le widget suivant de jQuery pour une liste déroulante auto-complétante.

(function($) { 
    $.widget("ui.comboboxGemeenten", { 
     _create: function() { 
      var focushelper = false; 
      var lastTerm; 
      var self = this; 
      var select = this.element.hide(); 
      var input = $("<input>") 
        .insertAfter(select) 
        .width(300) 
        .autocomplete({ 
         source: function(request, response) { 

          var jsonbox = { gem_query: request.term }; 
          lastTerm = request.term; 

          $.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) { 
           //alert("iets"); 
           if (data.succes == true && data.lastTerm == lastTerm) { 
           //alert(textlength); 
            //alert(data.lesplaatsen); 
            response($.map(data.gemeenten, function(item) { 

             return { 
              id: item, 
              // label: (item.Lpl_Gemeente == null ? "" : item.Lpl_Gemeente) + " - " + item.Lpl_Instelling, 
              value: item 
             } 
            })); 
           } else { 
            // alert("slecht"); 
           } 
          }, "json"); 
         }, 
         delay: 0, 
         change: function(event, ui) { 
          if (!ui.item) { 
           // remove invalid value, as it didn't match anything 
           $(this).val(""); 
           return false; 
          } 
          //alert(ui.item.id); 
          select.val(ui.item.id); 
          self._trigger("selected", event, { 
           item: select.find("[value='" + ui.item.id + "']") 
          }); 
         }, 
         focus: function() { 
          focushelper = true; 
         }, 
         minLength: 2 
        }) 
        .addClass("ui-widget ui-widget-content ui-corner-left") 
        .focus(function() {    //if it is default value, remove it. 
         if (select.val() == "" && !focushelper) { 
          //alert(select.val()); 
          $(input).val(""); 
         } 
        }) 
        .val(select.find("option:selected").text()); //return selected value for editing 

     } 
    }); 

})(jQuery); 

Le problème était que je reviens d'une longue liste d'articles, et quand j'écris dans le champ d'entrée pour filtrer, comme

« gen », il ferait un poste pour « g » pour « ge "et pour" gen "car il affiche à chaque changement. Le problème était que le dernier retour de la liste n'était pas toujours pour "gen" mais parfois pour "ge" alors mon résultat n'était pas correct. L'utilisation d'un delay n'a rien changé.

en utilisant minlength n'a pas d'importance, une fois que c'est plus que le minlength le problème se produit à nouveau.

alors qu'est-ce que je fais? J'ai utilisé var lastTerm pour vérifier sur la réception de ma liste, si ce résultat est pour le dernier terme écrit, et non pour un dans le milieu.

cela résout mon problème, mais ce n'est pas la meilleure chose.

Y a-t-il un moyen de stopper la publication, donc je ne gaspille pas une charge de ressources du serveur puisque les résultats pour le dernier terme, sont rejetés de toute façon.

la partie MVC:

[HttpPost] 
    public ActionResult FilterInstGem(string gem_query) { 
     List<string> lpls = _db.InstellingAdressens.Where(l => l.GEMEENTE.Contains(gem_query)).Select(q => q.GEMEENTE).Distinct().OrderBy(q => q).ToList(); 
     return Json(new { succes = true, lastTerm = gem_query, gemeenten = lpls }); 
    } 

la chose totale ressemble à: http://jqueryui.com/demos/autocomplete/#combobox

Answer 1

Depuis $.post() renvoie la XMLHttpRequest, vous pouvez enregistrer une référence à elle et l'annuler, comme ceci:

if(this.xhr) this.xhr.abort(); 
this.xhr = $.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) { 
    this.xhr = null; 
    //rest of your current post success code.... 
}); 

En les plaçant où vous en avez actuellement

$.post("/" + $.trim(window.location.pathname.substr(1, 9)) + "/Gemeenten/FilterInstGem/", jsonbox, function donedit(data) { 

Vous stockez la référence à la demande ... si une requête arrive avec succès (avant d'un autre tiré) il va annuler la dernière demande, si elle est pas interrompu et se termine, il va exécuter la success rappel que vous avez déjà, définissant this.xhr = null; afin que nous sachions qu'il n'y a rien à annuler la prochaine fois.