What's the difference between : 1. (ajaxStart and ajaxSend) and 2. (ajaxStop and ajaxComplete)?

jquery ajax post loading
CRISHK Corporation picture CRISHK Corporation · Sep 17, 2010 · Viewed 7.3k times · Source

Basically that's the question (parentheses are important)

Answer

Nick Craver picture Nick Craver · Sep 17, 2010

.ajaxStart() and .ajaxStop() are for all requests together, ajaxStart fires when the first simultaneous request starts, ajaxStop fires then the last of that simultaneous batch finishes.

So say you're making 3 requests all at once, ajaxStart() fires when the first starts, ajaxStop() fires when the last one (they don't necessarily finish in order) comes back.

These events don't get any arguments because they're for a batch of requests:

.ajaxStart( handler() )
.ajaxStop( handler() )

.ajaxSend() and .ajaxComplete() fire once per request as they send/complete. This is why these handlers are passed arguments and the global/batch ones are not:

.ajaxSend( handler(event, XMLHttpRequest, ajaxOptions) )
.ajaxComplete( handler(event, XMLHttpRequest, ajaxOptions) )

For a single documentation source, the Global Ajax Events section of the API is what you're after.

Related questions

jQuery Ajax File Upload

Can I use the following jQuery code to perform file upload using POST method of an ajax request ? $.ajax({ type: "POST", timeout: 50000, url: url, data: dataString, success: function (data) { alert('success'); return false; } }); If it is possible, do I need …

Read More
jQuery Ajax POST example with PHP

I am trying to send data from a form to a database. Here is the form I am using: <form name="foo" action="form.php" method="POST" id="foo"> <label for="bar">A bar</label&…

Read More
Access Control Request Headers, is added to header in AJAX request with jQuery

I would like to add a custom header to an AJAX POST request from jQuery. I have tried this: $.ajax({ type: 'POST', url: url, headers: { "My-First-Header":"first value", "My-Second-Header":"second value" } //OR //beforeSend: function(xhr) { // xhr.setRequestHeader("My-First-Header", "first value"); // …

Read More