ajax error cancel,How to cancel/abort jQuery AJAX request?

Create a function to call your API. Within this function we define request callApiRequest = $.get(... - even though this is a definition of a variable, the request is called immediately, but now we have the request defined as a variable. Before the request is called, we check if our variable is defined typeof(callApiRequest) != 'undefined' and also if it is pending suggestCategoryRequest.state() == 'pending' - if both are true, we .abort() the request which will prevent the success callback from running.

// We need to wrap the call in a function

callApi = function () {

//check if request is defined, and status pending

if (typeof(callApiRequest) != 'undefined'

&& suggestCategoryRequest.state() == 'pending') {

//abort request

callApiRequest.abort()

}

//define and make request

callApiRequest = $.get("https://example.com", function (data) {

data = JSON.parse(data); //optional (for JSON data format)

//success callback

});

}

Your server/API might not support aborting the request (what if API executed some code already?), but the javascript callback will not fire. This is useful, when for example you are providing input suggestions to a user, such as hashtags input.

You can further extend this function by adding definition of error callback - what should happen if request was aborted.

Common use-case for this snippet would be a text input that fires on keypress event. You can use a timeout, to prevent sending (some of) requests that you will have to cancel .abort().