current community

your communities

more stack exchange communities

company blog
Stack Exchange Inbox Reputation and Badges
tour help
Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise
up vote 1 down vote favorite

i need to parse the following json response.

{
"attrs": {
    "width": 578,
    "height": 200
},
"nodeType": "Stage",
"children": [
    {
        "attrs": {},
        "nodeType": "Layer",
        "children": [
            {
                "attrs": {
                    "x": 289,
                    "y": 100,
                    "sides": 6,
                    "radius": 70,
                    "fill": "red",
                    "stroke": "black",
                    "strokeWidth": 4
                },
                "nodeType": "Shape",
                "shapeType": "RegularPolygon"
            }
        ]
    }
]
}

for any help thanks..

share|improve this question
    
parse to get what ?? – bipen Apr 3 '13 at 10:24
    
Where are you getting this json response from? – eandersson Apr 3 '13 at 10:30
up vote 4 down vote accepted

we can easily parse using JSON.parse(YOUR-JSON-STRING)

var jsonStr = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

putting it all together finall solution would be something like below

var jsonStr = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

var parsedData = JSON.parse(jsonStr);
alert(parsedData.attrs.width)


$.each(parsedData.children, function (index, value) {
    $.each(this.children, function (index, value) {
        $('#mydata').append(' x value is : '+this.attrs.x);
        $('#mydata').append(' y value is : '+this.attrs.y);
    });
    console.log(this);
});

here is a live example http://jsfiddle.net/mayooresan/bMHN8/

share|improve this answer
    
thanks...it helped me... – user751828 Apr 3 '13 at 10:32
    
consider accepting it as correct answer if it helped you out. – Jay Mayu Apr 3 '13 at 10:34
    
yeah....do u have any idea how to represent this parsed data in xml tags showing parent and child nodes – user751828 Apr 3 '13 at 10:35
    
I'm not sure how you can do it, but you can check the xml syntax and build smoething out of the parsed values. – Jay Mayu Apr 3 '13 at 10:42
up vote 1 down vote 
var data = '{ "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }';

 var _json = JSON.parse(data);


    console.log(_json.attrs.width);

if you are retrieving JSON via Ajax in jQuery you can do:

 $.ajax({
    /* Set the JSON datatype in ajax call*/
    dataType:'json',
    ...
/* get json in response and you already have it "parsed" */
     success:function(json){

     console.log(json.attrs.width);
    }
    ...
    });
share|improve this answer
up vote 0 down vote

Use the parseJSON method:

var obj = $.parseJSON(json);

If you make an AJAX call to fetch the data, specify the JSON data type, and the response will be parsed automatically for you:

$.ajax({
  url: "jsondata",
  dataType: "json",
  success: function(obj) {
    alert(obj.nodeType);
  }
});
share|improve this answer
up vote 0 down vote

Using dot notation, you can access the properties and objects of your JSON data.

Firstly, assign your JSON response to a variable, e.g.

var json = { "attrs": { "width": 578, "height": 200 }, "nodeType": "Stage", "children": [ { "attrs": {}, "nodeType": "Layer", "children": [ { "attrs": { "x": 289, "y": 100, "sides": 6, "radius": 70, "fill": "red", "stroke": "black", "strokeWidth": 4 }, "nodeType": "Shape", "shapeType": "RegularPolygon" } ] } ] }

Example, to get the width of the JSON data object and display it via the console:

console.log(json.attrs['width']);

Returns: 578

And then to get the nested objects values, e.g.

console.log(json.children[0].children[0].attrs);

Returns: an object with the x, y, sides, radius, etc. properties.

To access these, e.g.

console.log(json.children[0].children[0].attrs['radius']);

Returns: 70

There is a more general answer to the dot and bracket notation/syntax here: How to extract a json object that's inside a json object

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.