Better jQuery Ajax error information

Question

When do a jQuery.ajax call, and it fails, the function assigned to the error option provides very sparse error information, yet when I use Chrome developer tools, the network tab, I see the response includes an HTML document with a much more verbose and informative explanation of the error.

Can I get this kind of error information back from the $.ajax call, and if so, how?

Is this error manually generated by your backend? What kind of error would have HTML included? — 4castle, May 20 '16 at 17:22

Sofiane Sadi · Answer 1 · 2016-05-20T17:36:50.867

0

You can use the jqXHR responseText property, it will use the browser's native XMLHttpRequest object and you can get the full response body.

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

http://api.jquery.com/jquery.ajax/#jqXHR

edited May 20 '16 at 17:36

answered May 20 '16 at 17:26

Sofiane Sadi

357
1
7

score 0 · Answer 2 · edited May 23 '17 at 11:44

0

The error callback in jQuery gives the XMLHttpRequest object as the first parameter.

Use xhr.response or xhr.responseText to get the full error page.

$.ajax({
    error: function(xhr, status, error) {
        xhr.response;
    }
});

For information on how to parse the response, see What is the best practice for parsing remote content with jQuery?

edited May 23 '17 at 11:44

Community

1
1

answered May 20 '16 at 17:26

4castle

32,613
11
69
106

score 0 · Accepted Answer · answered May 20 '16 at 17:29

0

Are you looking for something like this?

$.ajax({ cache: false,
    url: "/Admin/Contents/GetData",
}).fail(function (jqXHR, textStatus) {
    document.body.innerHTML = jqXHR.responseText;
});

https://plnkr.co/edit/Aj7Tgxxno9fCcYBlwKuJ?p=preview

answered May 20 '16 at 17:29

samir benzenine

478
4
11

score -2 · Answer 4 · answered May 20 '16 at 17:19

-2

   var printError = function( req, status, err ) {
  console.log( 'something went wrong', status, err );
};

// Create an object to describe the AJAX request
var ajaxOptions = {
  url: '/data/people.json',
  dataType: 'json',
  success: your function,
  error: printError
};

I think this is a better approach.

answered May 20 '16 at 17:19

vbotio

1,566
3
26
53

It's the bad solution I'm trying to improve on. It hardly gives any info, where the HTTP response to the `$.ajax` call includes a nice and verbose explanation of the error and even possible causes. That is the whole purpose of my question: how to get the info in that HTML document. – ProfK May 20 '16 at 17:35

Better jQuery Ajax error information

4 Answers4

Linked