Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

what is difference between success and .done() method of $.ajax

Can anyone help me?
I am not able to understand the difference between success and .done() of $.ajax.

If possible please give examples.

like image 461
Poonam Bhatt Avatar asked Jan 13 '12 08:01

Poonam Bhatt


People also ask

What is difference between success and complete in AJAX?

success() only gets called if your webserver responds with a 200 OK HTTP header - basically when everything is fine. However, . complete() will always get called no matter if the ajax call was successful or not - maybe it outputted errors and returned an error - . complete() will still get called.

What is success in AJAX?

What is AJAX success? AJAX success is a global event. Global events are triggered on the document to call any handlers who may be listening. The ajaxSuccess event is only called if the request is successful. It is essentially a type function that's called when a request proceeds.

What is success and error in AJAX?

success and Error : A success callback that gets invoked upon successful completion of an Ajax request. A failure callback that gets invoked in case there is any error while making the request.

What is AJAX done function?

The done() function is given a function as parameter. The callback function passed as parameter to the done() function is executed if the AJAX request succeeds. The callback function gets three parameters: data , textStatus and jqXHR . The data parameter is the data returned by the server.


2 Answers

success only fires if the AJAX call is successful, i.e. ultimately returns a HTTP 200 status. error fires if it fails and complete when the request finishes, regardless of success.

In jQuery 1.8 on the jqXHR object (returned by $.ajax) success was replaced with done, error with fail and complete with always.

However you should still be able to initialise the AJAX request with the old syntax. So these do similar things:

// set success action before making the request $.ajax({   url: '...',   success: function(){     alert('AJAX successful');   } });  // set success action just after starting the request var jqxhr = $.ajax( "..." )   .done(function() { alert("success"); }); 

This change is for compatibility with jQuery 1.5's deferred object. Deferred (and now Promise, which has full native browser support in Chrome and FX) allow you to chain asynchronous actions:

$.ajax("parent").     done(function(p) { return $.ajax("child/" + p.id); }).     done(someOtherDeferredFunction).     done(function(c) { alert("success: " + c.name); }); 

This chain of functions is easier to maintain than a nested pyramid of callbacks you get with success.

However, please note that done is now deprecated in favour of the Promise syntax that uses then instead:

$.ajax("parent").     then(function(p) { return $.ajax("child/" + p.id); }).     then(someOtherDeferredFunction).     then(function(c) { alert("success: " + c.name); }).     catch(function(err) { alert("error: " + err.message); }); 

This is worth adopting because async and await extend promises improved syntax (and error handling):

try {     var p = await $.ajax("parent");     var x = await $.ajax("child/" + p.id);     var c = await someOtherDeferredFunction(x);     alert("success: " + c.name); } catch(err) {      alert("error: " + err.message);  } 
like image 69
Keith Avatar answered Sep 22 '22 01:09

Keith


In short, decoupling success callback function from the ajax function so later you can add your own handlers without modifying the original code (observer pattern).

Please find more detailed information from here: https://stackoverflow.com/a/14754681/1049184

like image 43
batbaatar Avatar answered Sep 18 '22 01:09

batbaatar