0

I'm using jQuery autocomplete, but I found a performance-related issue - if I input 'abc', it will be scanning by 'a', by 'ab', and by 'abc', at a once, how can I stop the previous 'a', 'ab' when ajax calling is doing searching by 'abc'?

I use async true-false but it still give performance problem.Because response for 'ab' there is 100 item in response but for 'abc' there is only 1 item in response.So untill 100 item loaded for ab,one item load for 'abc' so it load wrong response.It load last response.It load 100 response for 'abc' but it should load 1 item..

Hope I made myself clear. Thanks in advance.

here is my ajax call

$.fn.autoComplate = function (ayar) {
var varsayilan = {
    url: 'url',
    culture: 'tr',
    icon: 'hotelsearchicon.png'
};
var ayar = $.extend(varsayilan, ayar);
var els = $(this);
var text = '';
var isfocus = false;
var isClick = false;
var isEnter = false;
var Ajaxrequest;
console.log('ajax req oluştu:' + Ajaxrequest);
//var SearchTimer;
var scroll;
return this.each(function () {

    els.find('input[type=text]').bind('focus', function (event) {

        isEnter = false;

        var textb = $(this);

        text = textb.val();

        if (!(text.length > 2)) {
            if (varsayilan.culture == "tr")
                els.find('ul').html('<li>Aramaya Başlamak için 3 Karakter Girin</li>').slideDown();
            else
                els.find('ul').html('<li>Please Enter 3 More Characters.</li>').slideDown();
        } else {
            els.find('ul').slideDown('');

            if (text != '') {
                textb.val(text);
            }
        }
    });

    els.find('input[type=text]').on('keyup', function (event) {

        text = $.trim($(this).val());

        isEnter = false;

        if (event.which != 38 && event.which != 40 && event.keyCode != 13) {
            if (text.length >= 3) {

                isEnter = false;
                //clearTimeout(SearchTimer);
                els.find('ul').html('');
                els.find('ul').slideDown();
                //els.find('ul').append('<li id="loading"><img src="https://www.sondakka.com/Content/images/loadingOrange.gif" /> ' + (varsayilan.culture == "tr" ? 'Sonuçlar getiriliyor.' : 'Loading.') + '</li>');


                //SearchTimer = setTimeout(function () {
                //alert('clear a düştü 1');
                if (text.length >= 3) {
                    if (Ajaxrequest) {

                       Ajaxrequest.abort();



                    }
                    Ajaxrequest = $.ajax({
                        //async: text.length >= 3 ? false : true,true olacak değiştirme..
                       async:true,
                        type: 'POST',
                        url: ayar.url,
                        data: { "q": text, "culture": ayar.culture },
                        success: function (data) {

                            els.find('ul').html('');
                            //alert('clear a düştü 2');
                            $.each(data, function (i, item) {


                                if ((item.Item1.indexOf("All Airports") > -1) || (item.Item1.indexOf("Tüm hava limanları") > -1)) {
                                    els.find('ul').append('<li iscity="true" ctype="' + item.Item3 + '"  data="' + item.Item2 + '">' + item.Item1 + '</li>');
                                }
                                else {
                                    els.find('ul').append('<li iscity="false" ctype="' + item.Item3 + '" data="' + item.Item2 + '">' + item.Item1 + '</li>');
                                }
                            });
isherwood
  • 58,414
  • 16
  • 114
  • 157
user1688401
  • 1,851
  • 8
  • 47
  • 83
  • The Turkish isn't helping me understand what you're doing (that is, the variable names are just gibberish to me), and your snippet appears truncated, but the jQuery UI `autocomplete` widget has a `minLength` option. If you're not using jQuery UI you might want to start. – Draco18s no longer trusts SE Dec 28 '15 at 15:34
  • Hi @Draco18s ,I stop previous request when new request raise.I am using request.abandon()... but it cause performance problems.some times it take 200 ms,sometime it take 2 second... beta.sondakka.com/en you can test here you can search for hilton......thanks – user1688401 Dec 28 '15 at 15:40
  • Possible duplicate of [jQuery autocomplete, Can I have the previous ajax calling stopped when I raise a new one?](http://stackoverflow.com/questions/4121963/jquery-autocomplete-can-i-have-the-previous-ajax-calling-stopped-when-i-raise-a) – Jeff Wilbert Jan 26 '17 at 22:43

0 Answers0