1

I am using AJAX to generate search suggestions by querying a database using a 'LIKE' query. Results are returned as the user types text into an input field.

The way I have it set up is as follows:

JQuery:

      var timer;
        $(".prod-name-input").keyup(function(){
            var self = this;
            clearTimeout(timer);
            searchword = self.value;
            timer = setTimeout(function(){
                $(".smart-suggestions").load('invoice-get-data.php?searchword=' + self.value);
            },300); //onkeyup event works with a 300 millisecond delay
        });

The problem is, if I type a word containing say 6 characters, it takes at least a couple of seconds before the AJAX results are populated for the complete word, it seems that there are multiple calls to the AJAX function by the time the user is done entering a word into the text field (due to the onkeyup event). I used var_dump on my mySQL query to try to see whats going on, and it shows that as soon as the complete search word is being queried, which is usually way too slow, and takes acouple of seconds using my method, the results are returned almost instantly,

My goal is to have search suggestions appear almost instantly, by avoiding the extreme lag I have now, so as soon as the user types some text in the input field, search suggestions appear. I was trying to carefully controlling the number of ajax calls to improve response time, without any success. I have been trying to solve this issue for days now and would appreciate any help with this. Many thanks in advance.

AnchovyLegend
  • 12,139
  • 38
  • 147
  • 231
  • Please check this [question](http://stackoverflow.com/q/10662871/1036917). It might be helpful. – Justin John Dec 16 '12 at 03:39
  • You need to abort the previous Ajax calls. If you really want performance, you have to avoid database lookups. – epascarello Dec 16 '12 at 03:40
  • Try reading this [question](http://stackoverflow.com/questions/13872515/perform-ajax-search-one-second-after-multiple-keydown-events) too. – bobthyasian Dec 16 '12 at 03:50
  • Thanks for the replies. Sorry, I am new to JQuery/ Ajax, when I try to abort my AJAX, I get an error that I cannot abort this kind of object. Can someone please show me how I would apply an abort, if a request is processing, in my code above by any chance? – AnchovyLegend Dec 16 '12 at 03:57
  • Can you post your code where you are aborting the old request? – Enrico Dec 16 '12 at 06:00

1 Answers1

0

My solution was to set a LIMIT to the mysql query, since I did not need 100 results for the query, but just a handful, this resulted in significant speed improvements by AJAX.

AnchovyLegend
  • 12,139
  • 38
  • 147
  • 231