Jquery ajax error callback

Question

I need some suggestions here or maybe some explanations. I have a jquery ajax call,

$.ajax({
 type: "GET",
 url: base_url+'/ajax/fetch/counts/',
 dataType: 'json',
 data: {},
 error: function(xhr, error){
        console.debug(xhr); console.debug(error);
 },
 success: display_counts
});

It's working fine. My success callback fires correctly with response. But, what I noticed is that my error callback is fired every time, even when my call returns success status 200. In the above error callback, I see that object xhr.status is 200.

Can anybody explain what's wrong, or what is happening here? error callback is supposed to fire only when I have 404 or maybe a non-200 response. Are my assumptions correct?

Thanks.

score 39 · Answer 1 · answered Jan 28 '13 at 13:24

39

Just an suggestion, try using the $.ajaxSetup() to get the correct error like this:

$(function() {
    $.ajaxSetup({
        error: function(jqXHR, exception) {
            if (jqXHR.status === 0) {
                alert('Not connect.\n Verify Network.');
            } else if (jqXHR.status == 404) {
                alert('Requested page not found. [404]');
            } else if (jqXHR.status == 500) {
                alert('Internal Server Error [500].');
            } else if (exception === 'parsererror') {
                alert('Requested JSON parse failed.');
            } else if (exception === 'timeout') {
                alert('Time out error.');
            } else if (exception === 'abort') {
                alert('Ajax request aborted.');
            } else {
                alert('Uncaught Error.\n' + jqXHR.responseText);
            }
        }
    });
});

answered Jan 28 '13 at 13:24

palaѕн

72,112
17
116
136

1

Just as an aside, [the Docs state](https://api.jquery.com/jquery.ajaxsetup/): *Note: Global callback functions should be set with their respective global Ajax event handler methods—.ajaxStart(), .ajaxStop(), .ajaxComplete(), .ajaxError(), .ajaxSuccess(), .ajaxSend()—rather than within the options object for $.ajaxSetup().* so it would seem that this would be better used in [`.ajaxError()`](https://api.jquery.com/ajaxError/) – Wesley Smith Jan 27 '16 at 02:47
1

So an important thing to realize of course is that your ajax could fail on a user's computer if their internet connection is spotty. So your app could be working fine but they get failed ajax requests because of a bad internet connection - which appears to be identifiable by the `status === 0` and `exception === 'timeout'` cases above. – Brad Parks May 04 '16 at 13:41
1

Also note that docs state that: "This can cause undesirable behavior since other callers (for example, plugins) may be expecting the normal default settings. For that reason we *strongly recommend against using this API.*" – eis Apr 12 '17 at 14:20

eis · Accepted Answer · 2013-06-15T17:57:43.903

35

Error callback is called on http errors, but also if JSON parsing on the response fails. This is what's probably happening if response code is 200 but you still are thrown to error callback.

edited Jun 15 '13 at 17:57

answered Mar 27 '13 at 18:27

eis

51,991
13
150
199

2

If you are expecting a non JSON response. You can set the dataType option to script/text...etc Checkout http://api.jquery.com/jQuery.ajax and look under dataFilter for more information. – thekindofme Sep 18 '13 at 07:34
I was calling a cgi script, I needed it to dump out the data in json format. It was returning a string which failed. – NuclearPeon Jul 28 '14 at 22:03

score 2 · Answer 3 · edited May 23 '17 at 12:10

2

A recent question had similar problem with json jquery requests, try removing surrounding () from your json response.

edited May 23 '17 at 12:10

Community

1
1

answered Sep 04 '10 at 12:59

aularon

11,042
3
36
41

Funny, I've had a similar problem that was fixed by *adding* surrounding brackets. – Amy B Sep 04 '10 at 13:07
@Coronatus Yes, this what I usually used to do, but jquery 1.4.2 starts to rely on browser's `JSON.parse`, my firefox's `JSON.parse` would parse `{"key":"value"}` successfully, but issue an error on `({"key":"value"})`. – aularon Sep 04 '10 at 13:12
To get around the differences in which browsers parse JSON, I would recommend using Douglas Crockford's parser: http://www.json.org/json2.js – Chris Laplante Sep 04 '10 at 13:16

Chris Laplante · Answer 4 · 2010-09-04T13:17:23.750

2

A few things I can think of:

Make sure you have disabled caching by setting cache: false.
If you are using Firefox, try using Firebug and the Net tab to monitor the request
Don't rely on the browser's JSON parser. I would recommend this one: https://github.com/douglascrockford/JSON-js/blob/master/json2.js from the creator of JSON no less

edited Sep 04 '10 at 13:17

answered Sep 04 '10 at 13:01

Chris Laplante

29,338
17
103
134

1

"trivial and obvious" - well, that was simply harsh. :) – Chris Laplante Sep 04 '10 at 13:18
Well sorry if that was really harsh. +1 already for referring to JSON parser thing. :) – simplyharsh Sep 04 '10 at 13:25
@SimpleCoder "Don't rely on the browser's JSON parser"?? why? is it the same for now?? – mfadel Jan 16 '13 at 11:44
1

@mfadel: Some older browsers don't support JSON, so using a third-party parser in the first-place could prevent compatibility headaches. – Chris Laplante Jan 16 '13 at 15:30

score 1 · Answer 5 · answered Sep 04 '10 at 14:03

I'm not a jQuery expert, but I know that bwith Prototype.js, the AJAX error handler fires if the request is successful but the success handler causes an an error. Is that the same in jQuery? You could test if this is what's happening by putting the entire contents of display_counts in a try..catch block.

score -1 · Answer 6 · edited Aug 21 '16 at 02:34

-1

Change dataType from plain/text to html

edited Aug 21 '16 at 02:34

Kevin Kopf

13,327
14
49
66

answered Aug 20 '16 at 15:12

jonasdev

1
3

...but OP doesn't even have plain/text dataType – eis May 13 '18 at 12:21

Jquery ajax error callback

6 Answers6

Linked

Related