AJAX doesn't pick up error

Question

I'm completely new to JSON, JS and AJAX. I'm used some example codes to progress through my targets. What I don't understand is when the JSON is an error object the success section is still firing. The console shows error where object d is null or a non-object when error is true. What have I done incorrectly? TIA

Result type good:

JSON: {"data":["1","breast","2","wing","3","thigh","4","leg","5","half","6","quarter white","7","quarter dark","9","whole"],"error":false}

Result type error:

JSON: {"error":true}

$.ajax({
            type     : 'GET',
            url      : 'getsubtypes2.php',
            data     : dataString,
            dataType : 'JSON',
            cache: false,
            success  : function(data) {          
                var output;            
                var d = data.data;
                    var output = "";
                    for (var i = 0 ; i< d.length; i=i+2) {//error gets to this line
                      var count = d[i];
                      var newOption = d[i+1];
                      output += "<option value='"+count+"'>"+newOption+"</option>";
                    }
                    $('#select3').empty().append(output); 
            },
            error: function(){
            $('#select3').empty();
                    console.log("Ajax failed");
            }
        });

Error will only fire when their is a real http error. You should add a check for that property within you success method. if(data.error) { // throw } — Michael D. Irizarry, Feb 07 '17 at 18:20

score 2 · Answer 1 · edited May 23 '17 at 10:29

2

The server must return an error status code such as 4xx or 5xx for the error callback to execute. If you server is returning a 2xx, the success callback will execute.

For testing you can try explicitly sending an error code to see the error callback executing. See this question.

edited May 23 '17 at 10:29

Community

1
1

answered Feb 07 '17 at 18:20

Alexander Staroselsky

37,209
15
79
91

score 2 · Answer 2 · answered Feb 07 '17 at 18:20

JQuery's $.ajax() routine relies on the HTTP response code to detect an error. If the service is returning a 200, even in an error condition (which does happen with some services) this could happen.

Try checking the network panel in your debugger to see what the service is really returning.

score 0 · Answer 3 · answered Feb 07 '17 at 18:27

As suggested this picks up the error correctly

$.ajax({
            type     : 'GET',
            url      : 'getsubtypes2.php',
            data     : dataString,
            dataType : 'JSON',
            cache: false,
            success  : function(data) {          
                var output;            
                var d = data.data;
                var e = data.error;
            if(e) {
                 $('#select3').empty();
            }
            else {
            var output = "";
                    for (var i = 0 ; i< d.length; i=i+2) {
                      var count = d[i];
                      var newOption = d[i+1];
                      output += "<option value='"+count+"'>"+newOption+"</option>";
                    }
                    $('#select3').empty().append(output); 
                }
            },
            error: function(){
            console.log("Ajax failed");
            }
        });

Do you have access to the server response? If you do, why not send an HTTP error code to indicate an error occurred? This would help ensure if you ever switched to any other front-end technology, the error would be effectively detected. — Alexander Staroselsky, Feb 07 '17 at 18:31

AJAX doesn't pick up error

3 Answers3