MarcinWolny
MarcinWolny

Reputation: 1645

jQuery and JSON vs IE - SCRIPT5007: Unable to get value of the property

I'm struggling to get this script working. It's basically a simple ajax call to retrieve data from a php which returns a JSON code.

function refreshWindows(){
if(AjaxPull && AjaxPull.readystate != 4){
    AjaxPull.abort();
}
AjaxPull = $.ajax({
    type: 'POST',
    url: $path,
    data: {
        ajax: true,
        mode: 'update',
        to: Math.round(currentDate.getTime() / 1000),
        from: Math.round(previousDate.getTime() / 1000)
    },
    dataType: "json",
    success: function (data) {
        alert(data); //that's for debug
        $replies = data.Updates;
        $.each($replies ,function(group,value) {
            if (value!=''){
                $("#group"+group+" .content").append(value);
                $("#group"+group+" .content").stop().animate({ scrollTop: $("#group"+group+" .content")[0].scrollHeight }, 800);
                if (!$("#group"+group+" .Window").is(':visible')) {
                    $("#group"+group+" .BottomBox").fadeTo('fast', 0.5).fadeTo('fast', 1.0);
                }
            }
        });
        previousDate = currentDate;
        currentDate = new Date();
        timeController.push( setTimeout(function(){refreshChatWindows();}, 500) );
    }
});

}

The error I get in Internet Explorer is:

SCRIPT5007: Unable to get value of the property 'Updates': object is null or undefined

Everything works fine in Firefox and Google Chrome.

Initially my code was made using .get but someone suggested switching to the .ajax - well, it didn't help. I tried using .done(function(data){ but it didn't work either. I also tried sending all of the data in my URL opposite to the data property, it worked fine in FF, but IE still popped the same error. Finally I tried adding different headers to the PHP, like for example header('Content-Type: application/json'); but it didn't change anything. I run out of ideas / possible solutions I could fine on stackoverflow, so any help would be appreciated.

In IE I went to Developer Tools, network tab and tried to see if everything works - yes, the request is being sent correctly with all the data, and a response I receive is correct JSON, just as it is in Firefox:

{"Updates":{"1":"","2":"","3":"","5":"","6":"","7":"","8":""},"time":{"from":"1367489761","to":"1367489761"}}

which gets me really confused, cause I'd have thought that Undefined error might happen only because something is not being sent back in IE for whatever reason, but clearly: It's not the case. I get my JSON back. Only IE for some unknown reason still thinks that data is undefined.

Upvotes: 8

Views: 3931

Answers (3)

MarcinWolny
MarcinWolny

Reputation: 1645

Ok, I found a solution finally. Basically:

  • Remove any headers sent by PHP script. Especially: Content-type headers. (luckily - seems like sessions still can be used)
  • Use }).done(function ( data ) { instead of success: function (data) {

and that's all. Suddenly it started to work. It's very weird. Seems like the shotgun tactic (randomly changing bits of code till it works) is actually a valid way of solving problems. hehehe

Upvotes: 4

Tuan
Tuan

Reputation: 1486

You have a character called ​ in your JSON.
See a description here: What's HTML character code 8203?

It's right before your colon here "time"​:

Can you clean your output and validate the JSON and try again?

Upvotes: 0

smoore4
smoore4

Reputation: 4866

I have a similar json call that returns data that looks like this:

{"GetTombstoneDataRestResult":{"AlphaSort":"Arai Junichi","Classification":"A&D Design Object"...etc

In other words, a lot like your json data. To reference it in jQuery, I use the callback name.

     $.ajax({
     type: "GET",
     dataType: "jsonp",
     url: url,
     success: function (result) {

     $('#screenshot').append('<p><strong>Title: ' +
     result.GetTombstoneDataRestResult.Title + '</strong><br />Year: ' +
     result.GetTombstoneDataRestResult.Dated + '<br />Artist: ' +
     result.GetTombstoneDataRestResult.DisplayName + '</p>');

     }
     });

Looks like you want to try this too:

var replies = data;
$.each(replies.Updates ,function(group,value) {

Upvotes: 0

Related Questions