stop running ajax calls

Question

i have a dynamic search in php with jquery. When i'm entering a letter, an ajax call starts. My problem is, that all ajax calls are working till end, so that every letter is a full call. When a user is entering a full word then i have unused requests. How can i stop the unused calls?

Thank you very much

sorry but what do you mean with 'I have unused requests'. On each letter press you do an ajax call, so when the last letter of the word you do this as well? — RvdK, Jan 04 '11 at 09:07
@PoweRoy: He meant there are a few requests, which he wants to `abort` upon newer keystrokes. — UltraInstinct, Jan 04 '11 at 09:22
This page has many great answers about that, and the accepted answer even has an easy jQuery example: https://stackoverflow.com/questions/446594/kill-ajax-requests-using-javascript-using-jquery — wildpeaks, Jan 04 '11 at 09:09

score 4 · Accepted Answer · answered Jan 04 '11 at 09:09

4

Use timeouts to delay the request for a few millisecond, and clear it when a new key is pressed.

something like

var searchtimeout;
$('#search').keyup( function(){
  if (searchtimeout)
      {
        clearTimeout(searchtimeout);
      }
  searchtimeout = setTimeout(function(){
                                // initiate the ajax call here..
                             }, 300);
} );

answered Jan 04 '11 at 09:09

Gabriele Petrioli

191,379
34
261
317

i don't know if this is really a good action, because the dynamic ajaxsearch should be fast and dynamic.^^ when i set a timeout the user must wait the time.and i don't think that this is really good. but thank you very much. i'll try if i haven't a better workaround – Wolf-Tech Jan 04 '11 at 09:16
1

OP wants to `abort` a request. I doubt if clearing a timer helps. – UltraInstinct Jan 04 '11 at 09:24
@Thrustmaster, does not help to abort already fired requests, but allows for a user to type multiple letters before firing one.. It is called **debouncing** and you can read a good article about it at http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/ – Gabriele Petrioli Jan 04 '11 at 09:27
@s.f you can control the delay before firing the request (*it is the **300** which stands for 300 milliseconds*). The idea is to select a delay that allows for word-typing speed (*without calling the ajax*) but not too slow as to cause actual waiting.. try to find the sweet spot.. You can also enumerate your requests (*by passing an incremental variable*) so you know which one to display on success (*in case a request ends after the next one has*) – Gabriele Petrioli Jan 04 '11 at 09:32

score 1 · Answer 2 · answered Jan 04 '11 at 09:04

1

Either use a button to process the request that the user has to click when their finished or perhaps use something like debouncing.

answered Jan 04 '11 at 09:04

fire

21,383
17
79
114

score 0 · Answer 3 · answered Jan 04 '11 at 09:03

0

One way you could do it , is to send the request when the user presses the return key , or atleast wait a few seconds ( 1-3 ) to see if the user stoped typing then make the request , you don't have to do the search for all changes on the input box .

answered Jan 04 '11 at 09:03

Poelinca Dorin

9,577
2
39
43

score 0 · Answer 4 · edited Dec 17 '16 at 10:44

Ok, here is my solution:

if (searchtimeout)
        {
            clearTimeout(searchtimeout);
        }
        searchtimeout = setTimeout(function(){
            if(x){
                x.abort();
                alert("MACH WEG!");
            }
            x = $.post(url + "ajax.html?nsearch=1&ckey="+SID, {queryString: ""+inputString+""}, function(data) { // Do an AJAX call
                $('#suggestions').fadeIn(); // Show the suggestions box
                $('#suggestions').html(data); // Fill the suggestions box
                x = null;
            });
        }, 300);

score 0 · Answer 5 · answered Jan 04 '11 at 10:33

Why dont you use the autocomplete plugin in jquery.. I am assuming you have handcoded the dynamic lookup.. auto complete takes care of most of these things and it is also configurable as to after how many letters you want to post to the server..it also implements caching.

I have used it in a lot of asp.net projects and it is pretty neat.. docs.jquery.com/Plugins/autocomplete

stop running ajax calls

5 Answers5