Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery abort() ajax request before sending another

Based on: Abort Ajax requests using jQuery... In inventory_search() - before the ajax request is made, how can I check for any current requests and abort() them before making a new request? Or... Is there a better way to do this?

<script type="text/javascript">      $(function() {         $('form#internal_catalog').change(function() {             inventory_search();         });     });      function inventory_search() {         var search_data = $('form#internal_catalog').serialize();         var a = $.ajax({             type: 'post',             url: '/test.php',             data: search_data,             success: function(data) {                 $('#catalog').html(data);             }         });     }  </script> 
like image 580
mike Avatar asked Jul 22 '10 20:07

mike


People also ask

How do you abort an ajax call?

Just use ajax.abort(); } //then you make another ajax request $. ajax( //your code here );

How do I cancel my ongoing ajax request?

ajax({ type: 'POST', url: 'someurl', success: function(result){} }); Then you can abort the request: request. abort();

How do I stop XHR request?

The XMLHttpRequest. abort() method aborts the request if it has already been sent. When a request is aborted, its readyState is changed to XMLHttpRequest. UNSENT (0) and the request's status code is set to 0.

How do you send ajax request every 5 seconds?

Use just setTimeout(executeQuery, 5000); instead of setTimeout('executeQuery()', 5000); - it's shorter and faster.


1 Answers

Create an array queue of all your requests. Then if you find a point where you need to abort all existing requests you can just loop through the array and call abort on all pending requests. Should be pretty simple.

Though the other way is to just keep an internal flag that indicates whether a request is currently in process and skip the request if there is one. Or handle how you see fit.

EDIT: Check this SO question for a similar situation: How to avoid 3 ajax calls?

EDIT 2: So I what you can do is have an array that you append all your ajax calls to. Which is essentially just making an XmlHttpRequest and that is what is returned from the ajax call. So

requests.push(     $.ajax({         type: 'post',         url: '/test.php',         data: search_data,         success: function(data) {             $('#catalog').html(data);         }     })); 

This will add all your requests to a requests array which you can define somewhere. Then when you want to kill all pending requests you can just loop through the array and call abort which will kill the request.

for(var i = 0; i < requests.length; i++)     requests[i].abort(); 

Or just define a variable outside of your function that is a flag indicating whether a request is being made. You can even make it more specific and store the search data and only skip requests that have a pending request for the same data and allow other requests that are for different data.

Hopefully that is enough to get you started.

like image 51
spinon Avatar answered Sep 19 '22 20:09

spinon