CODEWITHSUNDEEP
javascriptjson
Dav.id
Dav.id

Reputation: 2797

Javascript looping through a JSON string

Ok, a little new to JSON format..

I have the following JSON string returned from an AJAX call, which firebug actually displays in a tree quite nicely.. however I can't seem to be able to work out how to loop through the content... 

{"data":{"item":[{"@id":"7","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"00:02:18"},{"@id":"8","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"08:26:24"}]}}

I have tried to say get a count of items.. alert(data.item.length); or a loop:

for(i=0; i<data.item.length; i++)
{
    alert(data.item[i].FromMember);
}

obviously missing something fundemental...

Any ideas??

Upvotes: 4

Views: 21487

Answers (5)

Peter Ajtai
Peter Ajtai

Reputation: 57685

You were very close... "data" is actually a key in your JSON, so you have to refer to your JSON variable to access "data".... so you want JSON.data.item[i].FromMember

Here is some full working code:

(function () {
    var json = {"data":{"item":[{"@id":"7","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"00:02:18"},{"@id":"8","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"08:26:24"}]}};

    var i;
    var iLength = json.data.item.length;
    for (i = 0; i < iLength; i++) {
        alert(json.data.item[i].FromMember);
    }
})();​

jsFiddle

Upvotes: 2

Mic
Mic

Reputation: 25164

The JSON object is a standard in the new browsers. For older browsers you can add the javascript library json2.js from json.org (2.5kb minified).

To transform the string to an object, use JSON.parse

var response = JSON.parse('{"data":{"ite...ime":"08:26:24"}]}}'),
    item = response.data.item;

And to send back your data to the server, use JSON.stringify:

var jsonString = JSON.stringify(theObject);

Upvotes: 5

Q_Mlilo
Q_Mlilo

Reputation: 1787

Just pass your json to the function below.

function getData(obj) {
    var myData = obj.data.item, i, output = '';

    for (i = 0; i < myData.length; i += 1) {
        for (key in myData[i]) {
         output += key + " : " + myData[i][key];
        }       
    }
    return output;
}

Click for example

Upvotes: 0

RPM1984
RPM1984

Reputation: 73112

Make sure you use de-serialize the JSON.

var data = Sys.Serialization.JavaScriptSerializer.deserialize(json);

Depends on which JavaScript frameworks you are using, each has it's own de-serializer.

The above example is using the MicrosoftAjax.js library.

More info here.

Upvotes: 0

Reigel Gallarde
Reigel Gallarde

Reputation: 65264

you should have something like this for it to work. notice the obj in the for-loop.

var obj = {"data":{"item":[{"@id":"7","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"00:02:18"},{"@id":"8","fromMemberID":"7","FromMember":"david","notificationsType":"event","notificationsDesc":"A new event (Test Event Thursday, 16 September 2010) has been created.","notificationsDate":"16 Sep 2010","notificationsTime":"08:26:24"}]}};

for (i = 0; i < obj.data.item.length; i++) {
    alert(obj.data.item[i].FromMember);
}​

or if you have data as your variable, still you should call it as data.data.item.length.

Upvotes: 0

Related Questions