AJAX jQuery success with IE8, fails with IE10/Chrome/FF

Question

I am facing a very odd issue with jQuery and AJAX. My AJAX call goes to success with IE8 but into error with IE10, Chrome and Firefox.

Here is the PHP code in Zend Framework 2:

$response = $this->getResponse();
$headers = $response->getHeaders();
$headers->clearHeaders()
        ->addHeaderLine('Content-Type', 'application/json; charset=utf-8');
$response->setContent(json_encode($array));
return $response;

Where $array is a PHP array.

Here is my Javascript code:

$.ajax({
    url: "/application/getTypeDossierParPilote/" + idPilote,
    type: "POST",
    async : false,
    success: function(data) {
        LISTE_TYPE_BANDEAU = data;
        ID_PILOTE_SELECTED_BANDEAU = idPilote;
        LISTE_TYPE_BANDEAU_LOADED_BANDEAU = true;                    
    },
    error: function errorHandler(e)             
        ID_PILOTE_SELECTED_BANDEAU = 0;
        LISTE_TYPE_BANDEAU_LOADED_BANDEAU = false;
        LISTE_TYPE_BANDEAU = null;                      
    }                
});

When using IE8, it goes to success and the data are usable. When using IE10, it goes to error. Although, when my client tries this on IE10, he doesn't get any issue, so I assume it goes straight to success.

I have tried adding something like dataType: "json", and even dataType: "html", to check whether the JSON is correct or not and it goes to success in that latter case but the data are not usable.

When I use the developer mode of the browser to copy the response body and check on http://jsonlint.com/ whether the JSON is correct or not I get the following message :

JSON.parse: unexpected character at line 1 column 1 of the JSON data

where the first character is the curly bracket. Here is an example of a JSON that I get :

{
    "typeDossier": [
        {
            "type": "MED",
            "famille": "AEC",
            "codeType": 1,
            "session": ""
        },
        {
            "type": "HPS",
            "famille": "AEC",
            "codeType": 2,
            "session": ""
        }
    ],
    "aecHps": true,
    "CodeAecHps": "1,2,",
    "tous": "1,2,"
}

Hope you can help me out with this weird issue. Thank you in advance. Regards,

your json isn't valid, and jQuery's built-in json parser is incorrectly telling you that it is. My assumption would be you're using an older version of jQuery that had a more forgiving built-in json parser. Modern browsers use the one provided by the browser instead of the one that comes with jQuery, which is why all of your modern browsers are correctly failing on the invalid json. — Kevin B, Jul 30 '15 at 16:15
Thank you for your reply, I am using jQuery v1.10.2. Something I forget to say as well which is very important is that my client can get it working on IE10 in his environment. Which is the weirdest thing. I will edit my post now. — mentinet, Jul 30 '15 at 16:28

score 0 · Accepted Answer · edited May 23 '17 at 12:29

0

My problem has been fixed and was caused by BOM characters which appeared in the configuration file of my project.

Check here to see how I fixed it: Web server response generates UTF-8 (BOM) JSON

edited May 23 '17 at 12:29

Community

1
1

answered Aug 14 '15 at 14:06

mentinet

744
3
9
23

AJAX jQuery success with IE8, fails with IE10/Chrome/FF

1 Answers1