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

by

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); 
}

More Related Contents:

  1. jQuery deferreds and promises – .then() vs .done()
  2. Problems inherent to jQuery $.Deferred (jQuery 1.x/2.x)
  3. How do you work with an array of jQuery Deferreds? [duplicate]
  4. jQuery Deferred – waiting for multiple AJAX requests to finish [duplicate]
  5. How to make all AJAX calls sequential?
  6. When should I use jQuery deferred’s “then” method and when should I use the “pipe” method?
  7. What are deferred objects?
  8. How to chain ajax calls using jquery
  9. jQuery.when understanding
  10. jQuery jqXHR – cancel chained calls, trigger error chain
  11. jQuery: execute array of functions sequentially (both deferreds and non-deferreds)
  12. Why is my jQuery :not() selector not working in CSS?
  13. Getting jQuery to recognise .change() in IE
  14. Add comma to numbers every three digits
  15. Play/pause HTML 5 video using JQuery
  16. jQuery CSS – Write into the -tag
  17. Simulate click on select element with jQuery
  18. Limit Checkbox amount
  19. Redirecting after AJAX post in Django
  20. How to change height div on window resize?
  21. How do I pass a Dictionary as a parameter to an ActionResult method from jQuery/Ajax?
  22. jquery live event for added dom elements
  23. Fancybox2 – different content for tooltip and image title, both from title attribute?
  24. jQuery: Test if checkbox is NOT checked
  25. Manually set unobtrusive validation error on a textbox
  26. How to submit form without refreshing page using Django, Ajax, jQuery?
  27. jQuery how to undo a select change
  28. Problem when retrieving text in JSON format containing line breaks with jQuery
  29. jQuery Deferred’s, $.when() and the fail() callback arguments
  30. JQuery-Mobile collapsible expand/collapse event

Leave a Comment