Checking Jquery ajax load success

Question

I've been using this to load another page:

http:||docs.jquery.com/Ajax/load

and just using their example,

$("#links").load("/Main_Page #jq-p-Getting-Started li");

However I want to run a function when the load is successful, and a different one if it fails, unfortunately the description on the callback says:

The function called when the ajax request is complete (not necessarily success).

How do I make sure the load was successful?

Thanks.

Answer 1

Check the textStatus of the response.

$("#links").load("/Main_Page #jq-p-Getting-Started li", 
  function (responseText, textStatus, XMLHttpRequest) {
    if (textStatus == "success") {
         // all good!
    }
    if (textStatus == "error") {
         // oh noes!
    }
  }

In determination to figure out the issue:

An example of success:

http://jsbin.com/ageju

An example of fail:

http://jsbin.com/arite

Answer 2

The second argument to your callback is the string status value for the request, which will be one of "beforeSend", "success", "complete", and "error".

Answer 3

You might try using the more detailed $.ajax() method call. This will give you more fine-grained control over the AJAX call (but it also requires a bit more work than a simple .load().) It will allow you to call different functions based on whether your call returns success or error.

Check out: http://docs.jquery.com/Ajax/jQuery.ajax#options for documentation on this function. If you click the "Options" tab on that page, you will get a full listing of the parameters that you can pass to the $.ajax() function.