Как предотвратить отправку запроса ajax при обработке другого запроса ajax?

Я работаю над автоматическим полным полем поиска, которое ищет базу данных и возвращает пользователей, которые связаны с поиском. Я использую jquery ajax для этого. После того, как keyup на элементе ввода произошел, я отправляю запрос ajax в `/ ajax/search/url как показано ниже:Как предотвратить отправку запроса ajax при обработке другого запроса ajax?

$("#search").keyup(function(){ 
    $(".itemSearch").remove(); 
    $(".notfound").hide(); 
    $("#searchResultSection").height("70px"); 
    if(!$("#search").val()){ 
     $("#searchResultSection").slideUp(); 
     $(".ajaxLogoSearch").hide(); 
     $(".notfound").hide(); 
    } 
    else{ 
     var data = { 
      query: $("#search").val() 
     }; 
     $("#searchResultSection").slideDown(); 
     $(".ajaxLogoSearch").show(); 
     $.ajax({ 
      url: '/ajax/search', 
      data: data, 
      dataType:'json', 
      success:function(result){ 
       if(result.found==0){ 
        $(".ajaxLogoSearch").hide(); 
        $(".notfound").show(); 
       } 
       else{ 
        var searchResult = $("#searchResultSection"); 
        $(".ajaxLogoSearch").hide(); 
        searchResult.css({"height":20}); 

        for(var i=0;i<result.users.length;i++){ 
         var content = '<div class="itemSearch">\ 
       <img src="../../static/social/images/defaultMaleImage.png" height="50px">\ 
       <p>'+ result.users[i].firstname+ ' '+ result.users[i].lastname +'</p>\ 
      </div>' 
         if(searchResult.height() < 370){ 
          searchResult.height("+=70px"); 
         } 
         $("#innerSearch").append(content); 
        } 
        $(".itemSearch").hover(function(){ 
         $(this).css({"background":"rgb(55, 108, 221)"}); 
        },function(){ 
         $(this).css({"background":"#658be6"}); 
        }); 
       } 
      } 

     }); 
    } 
})

Моя проблема когда я печатаю 2 письма сразу запрос 2 Аякса посланного, и я вижу результат поиска дважды результаты поиска box.I хочет способ предотвратить, чтобы отправить запрос в то время как 2-е АЯКСА первого не является полностью. Как я могу это сделать?

EDIT: Наконец-то я нашел решение на сайте codeproject благодаря вашим ответам. this is thte link of the solution

источник

2013-09-04 mojibuntu

Какую версию JQuery вы используете, и вы используете любую блесну или анимацию то время как AJAX запрос? –

@MinaGabriel моя версия jquery 2.0.3, и я использую spinner в моем коде '$ (". AjaxLogoSearch "). Show();' – mojibuntu

Похоже, вы добавляете к результатам поиска, когда вы должны их заменять , –

Лучший способ - просто не отправлять запрос, пока пользователь не перестанет печатать. это легко сделать, используя событие keydown и дроссель, ожидающий 250 мс бездействия. Выполнение этого по-своему приведет к тому, что пользователь не захочет получить результаты.

$("#search").on("keydown",function(){ 
    var $this = $(this); 
    clearTimeout($this.data("throttle")); 
    $this.data("throttle",setTimeout(function(){ 
     doSearch.call($this.get(0),$this.val()); // perform the ajax search 
    },250)) 
});

Кроме того, при вставке новых результатов, построить весь список результатов в одной переменной а затем вставить его сразу с .html (thehtml) после цикла.

источник

2013-09-04 19:27:09

спасибо, но у меня такая же проблема :( – mojibuntu

что такое * «та же проблема» * означает, что у вас много проблем. И проблема, с которой вы сталкиваетесь, может быть связана с тем, как вы внедрили мое решение. –

Я использую ваш код, но все же я вижу дублированные данные в результатах поиска – mojibuntu

Вы должны создать дополнительный запрос переменной типа. Эта переменная будет ссылкой на хранилище текущего ajax-запроса. При повторном вызове keyup вы должны выполнить проверку.

if(request) { 
    request.abort(); 
} 
request = $.ajax({/* */});

UPD1: Если первый Ajax-запрос завершен, вы должны установить на ноль переменного запроса в успехе обратного вызова.

UPD2: Подписаться на события изменения лучше

источник

2013-09-04 19:31:07 user2417329

Вы должны показать примеры «UPD1» и «UPD2». Это не очень понятно. – Hogan

Как предотвратить отправку запроса ajax при обработке другого запроса ajax?

ответ

Смежные вопросы