jQuery, ajax request doesn't success with JSON on IE

Question

I made an AJAX call and it works on FF & Chrome but not on IE 7-8-9. I'm loading a JSON file from my domain:

    $.ajax({
        url: 'js/jquery.desobbcode.json',
        dataType: 'json',
        cache: false,
        success: function(json) {
            alert('ok');
        },
        error: function(xhr, errorString, exception) {
            alert("xhr.status="+xhr.status+" error="+errorString+" exception="+exception);
        }
    });

I also tried by adding contentType: 'application/json' but I receive the same output which is :

xhr.status=200
error=parsererror
exception=SyntaxError Unterminated string constant

I checked my JSON file with JSONLint and it's OK. I checked if there is an extra comma and the content is also trimmed. See my JSON file

If I put dataType: 'text', I receive the OK alert but a debug popup too.

Could you help me? Regards.

Solution 1

IE is known to have issues with implied content types.

... the new XmlHttpRequest class in Internet Explorer 7 doesn’t implement setRequestHeader very intuitively. Instead of setting the specified header, it appends the value.

Try specifying a contentType and check what's coming back from the server:

$.ajax({
    url: 'js/jquery.desobbcode.json',
    dataType: 'json',
    contentType: "application/json; charset=utf-8",
    ...
});

You may also want to try sending blank data:

$.ajax({
    url: 'js/jquery.desobbcode.json',
    dataType: 'json',
    contentType: "application/json; charset=utf-8",
    data: {}
    ...
});

Solution 2

If you are using php script to echo your json as a string just put

header('Content-Type: application/json; charset=utf-8');

before

echo $jsonString

line.

Solution 3

It's the newlines in the JSON. This should parse in IE:

{"inputButton":[{"id":"desoBBCode_bold","value":"Gras","tag":"b"},{"id":"desoBBCode_italic","value":"Italique","tag":"i"},{"id":"desoBBCode_underline","value":"Souligné","tag":"u"},{"id":"desoBBCode_image","value":"Image","tag":"img"},{"id":"desoBBCode_link","value":"Lien","tag":"url"},{"id":"desoBBCode_quote","value":"Citation","tag":"quote"}],"selectTextSize":[{"text":"Taille","value":""},{"text":"Trèstrèspetit","value":"1"},{"text":"Trèspetit","value":"2"},{"text":"Petit","value":"3"},{"text":"Gros","value":"4"},{"text":"Trèsgros","value":"5"},{"text":"Trèstrèsgros","value":"6"}],"selectTextColor":[{"text":"Couleur","value":"a"},{"text":"Rouge","value":"red"},{"text":"Bleu","value":"blue"},{"text":"Vert","value":"green"}]}

Live example: http://jsbin.com/umahiq/edit

Comments

[aziz punjani]

Didn't know such a mime type existed.

[Matt MacLean]

I don't think it actually does, the RFC says application/json is the correct mime, but I've found text/json to work more consistently.