javascript - jquery ajax call returning an error with readystate 4, status 200, statustext ok

Question

This is really boggling my mind. I get an error callback from ajax. But if I take the res.responseText (which comes back correct, btw) from the error message and use it, it does the right thing. Just as if I had received a success callback.

The data is set like this:

var dataToSend = {fieldname : textdata};

and the ajax call is like this:

var ajaxOptions = {
    url: '/newpage',
    data: JSON.stringify(dataToSend),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    cache: false,
    processData: false,
    type: 'POST',
    success: function(res) {
        console.log("success!");
        $('#' + divname).html(res);
    },
    error: function(res) {
        console.log("There was an error: " + JSON.stringify(res));
        $('#' + divname).html(res.responseText);
    }
};

$.ajax(ajaxOptions);

The error message is : There was an error: {"readyState":4,"responseText" [this part is perfectly fine], "status":200, "statusText":"OK"}.

Answer 1

If your responseText isn't a correct JSON, a parsing error is thrown. Either make sure your response is a valid JSON or remove dataType: "json".

From jQuery docs:

dataType (default: Intelligent Guess (xml, json, script, or html))

Type: String

The type of data that you're expecting back from the server. If none is specified, jQuery will try to infer it based on the MIME type of the response (an XML MIME type will yield XML, in 1.4 JSON will yield a JavaScript object, in 1.4 script will execute the script, and anything else will be returned as a string). The available types (and the result passed as the first argument to your success callback) are:

...

"json": Evaluates the response as JSON and returns a JavaScript object. Cross-domain "json" requests are converted to "jsonp" unless the request includes jsonp: false in its request options. The JSON data is parsed in a strict manner; any malformed JSON is rejected and a parse error is thrown. As of jQuery 1.9, an empty response is also rejected; the server should return a response of null or {} instead. (See json.org for more information on proper JSON formatting.)