Ajax Error: 200 Response Code

Question

I'm using the jQuery Form plugin to handle a form submission with Ajax:

$('.login-form').ajaxForm({
    dataType: 'json',
    success: function(data){
        console.log('Success!');
        console.log(data);
    },
    error: function(data){
        console.log('There was an error:');
        console.log(data);
    }
})

After submission, the ajax returns an error with a status of "200". This is the JSON-formatted response:

{
    "success": false, 
    "heading": "The following errors were encountered", 
    "message": "<ul><li>The existing username and/or password you submitted are not valid</li></ul>"
}

I ran that through jsonlint.com , and it returned as valid.

In Chrome's Network tab, the response is returned as type application/json .

So why is ajax returning "error" rather than "success"?

jQuery 1.9.1

Answer 1

The value of the JSON message key had a line break inside it, which for some reason caused an error:

{
    "success": false, 
    "heading": "The following errors were encountered", 
    "message": "<ul><li>The existing username and/or password you submitted are not valid</li>
</ul>"
}

I wouldn't think line breaks inside a string would matter, but I guess they do...