javascript - jquery abort() ajax request before sending another

Question

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>

Answer 1

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.