Tom Lehman
Tom Lehman

Reputation: 89173

Getting AJAX response body for use in error callback

jQuery's AJAX error function has the following parameters:

error(XMLHttpRequest, textStatus, errorThrown)

What's the best cross-browser way to get the response body?

Does this work (reliably in all browsers)?

$.ajax({
  error: function(http) {
    alert(http.responseText);
  }
});

Upvotes: 57

Views: 53579

Answers (4)

dowski
dowski

Reputation: 3236

As of jQuery 1.4.1 you should use:

var json = JSON.parse(xhr.responseText);

See http://api.jquery.com/jQuery.parseJSON/.

Upvotes: 100

Vlado
Vlado

Reputation: 3777

One straightforward usage example with jQuery:

var url = '/';
$.get(url).then(
  function(response) {
      $("#result").html(response);
  },
  function(jqXHR) {
    $("#result").html('Error occurred: '+ jqXHR.statusText + ' ' + jqXHR.status);
  }
); 

This should return the HTML of current website front page.

Then try entering a nonsense URL that doesn't exist and see the error thrown. You should get "404 Not Found" from web server. Test it: JSFiddle here

Upvotes: 1

Pierre de LESPINAY
Pierre de LESPINAY

Reputation: 46158

For a more recent and general answer (since jquery 1.5), I'd use the jqXHR object:

$.ajax(url).fail(function(jqXHR, textStatus, errorThrown) {
    alert(jqXHR.responseText);
})

Alternatively responseJSON can be used to get the response body already parsed

$.ajax(url).fail(function(jqXHR, textStatus, errorThrown) {
    console.log(jqXHR.responseJSON);
})

Upvotes: 31

Emil Ivanov
Emil Ivanov

Reputation: 37633

There is a hidden function that can extract the data from XHR istance:

var responseText = $.httpData(xhr)

If you pass "json" as a second parameter it will treat the response as a JSON string.

Note that you might get an error because there is no response (network problem for example). Make sure you cover that case as well. Also, I believe (not sure) that jQuery invokes the error handler if the server returns a 4xx or 5xx status.

Upvotes: -4

Related Questions