Question

Json is sitting on my localhost as: /data/:

{
"children": [
    {
        "name": "analytics",
        "size": "1243"
    },
    {
        "name": "math",
        "size": "4343"
    },
    {
        "name": "algebra",
        "size": "1936"
    },
    {
        "name": "calc",
        "size": "3936"
    },
    {
        "name": "geom",
        "size": "2136"
    },
    {
        "name": "Quant",
        "size": "4136"
    }
]

}

Here is how I am trying to access the json:

var interval = setInterval(function() {
        $.getJSON("http://localhost:8080/dev_tests/d3/examples/data/flare2.json", function(json) {
            $.each(json.children,function(i,name){
            alert(json.children);
            });

        });
        }, 3000);

The data comes in just fine. That is, when I run console.log(json) I can see the above json name/value txt pairs in firebug. However, before each name value pair I see the word Object. So for example instead of my log showing { name=”analytics”, size=”1243″},.. it actually shows: [Object { name=”analytics”, size=”1243″},… And that too is what my alert shows: [object Object] instead of name=”analytics”, size=”1243″.
Why is this and is there a way to get my json name/value pairs in text so that I can store as a javascript String?

Many thanks in advance.

Answer 1

The O in JSON stands for “object.” It’s a way of serializing a JavaScript object to a string (and back). You seem to be relying on the conversion on one hand (referencing children) but not want to have the conversion done on the other hand. If you really want children to be a collection of strings in the format you describe, you should store it that way. If you really do want the object notation (and conversion to objects in the client), then you can simply use the properties of the object.

var interval = setInterval(function() {
    $.getJSON("http://localhost:8080/dev_tests/d3/examples/data/flare2.json", function(json) {
        $.each(json.children,function(i,item){
           alert("name = " + item.name + ", size = " + item.size);
        });

    });
    }, 3000);