How to cancel/abort jQuery AJAX request?

by

The jquery ajax method returns a XMLHttpRequest object. You can use this object to cancel the request.

The XMLHttpRequest has a abort method, which cancels the request, but if the request has already been sent to the server then the server will process the request even if we abort the request but the client will not wait for/handle the response.

The xhr object also contains a readyState which contains the state of the request(UNSENT-0, OPENED-1, HEADERS_RECEIVED-2, LOADING-3 and DONE-4). we can use this to check whether the previous request was completed.

$(document).ready(
    var xhr;
    
    var fn = function(){
        if(xhr && xhr.readyState != 4){
            xhr.abort();
        }
        xhr = $.ajax({
            url: 'ajax/progress.ftl',
            success: function(data) {
                //do something
            }
        });
    };

    var interval = setInterval(fn, 500);
);

More Related Contents:

  1. jQuery: Performing synchronous AJAX requests
  2. jQuery.ajax handling continue responses: “success:” vs “.done”?
  3. Two $.post requests one after the other.Second $.post request doesn’t get executed
  4. jQuery $.ajax(), $.post sending “OPTIONS” as REQUEST_METHOD in Firefox
  5. Problems with jQuery getJSON using local files in Chrome
  6. jQuery Upload Progress and AJAX file upload
  7. jQuery send string as POST parameters
  8. How to enable cross-domain request on the server?
  9. Call jQuery Ajax Request Each X Minutes
  10. How to check if jQuery.ajax() request header Status is “304 Not Modified”?
  11. Cross-Domain Requests with jQuery
  12. $.ajax call working fine in IE8 and Doesn’t work in firefox and chrome browsers
  13. ‘No Transport’ Error w/ jQuery ajax call in IE
  14. Extract part of HTML document in jQuery
  15. Setting processData to false in jQuery breaks my AJAX request
  16. how does jquery’s promise method really work?
  17. Multiple ajax calls at same time
  18. jQuery AJAX ‘multipart/form-data’ Not Sending Data?
  19. How to change ajax-charset?
  20. Redirecting after Ajax post
  21. Ajax response inside a div
  22. Multiple input validation
  23. how to do file upload using jquery serialization
  24. Jquery/Ajax Form Submission (enctype=”multipart/form-data” ). Why does ‘contentType:False’ cause undefined index in PHP?
  25. How do I POST with jQuery/Ajax in Django?
  26. JQuery Ajax – How to Detect Network Connection error when making Ajax call
  27. cross-origin ‘Authorization’-header with jquery.ajax()
  28. How do I abort image load requests without using window.stop()
  29. Pass data from jQuery to PHP for an ajax post
  30. jQuery Ajax request every 30 seconds

Leave a Comment