Looping JSON structure using jQuery

Question

JSON

{
    "form": {
        "roles": {
          "role": [
            { "name": "RoleB" },
            { "name": "RoleA" }
          ]
        },
        "rows":[
            {
                "id":"1",                               
                "fields":{              
                    "field":[
                        {
                            "fname":"Matt"
                        }
                    ]
                }
            }
        ]
    }
}

How can I access the value of fname using jquery?

This is what I'm doing --

jQuery.each(response.form.rows.fields.field, function(i, val){
     alert(this.fname);
}

Blazemonger · Accepted Answer · 2011-11-15 21:33:49Z

3

Watch out for those arrays....

response.form.rows[0].fields.field[0].fname

Or, in your case (and assuming there's only one rows element):

jQuery.each(response.form.rows[0].fields.field, function(i, val){
     alert(this.fname);
});

If there's more than one element in rows, you need a second loop:

jQuery.each(response.form.rows, function() {
    jQuery.each(this.fields.field, function(i, val) {
        alert(val.fname);
    });
});

http://jsfiddle.net/mblase75/33H8L/

edited Nov 15, 2011 at 21:33

answered Nov 15, 2011 at 21:28

Blazemonger

93.3k28 gold badges147 silver badges181 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Looping JSON structure using jQuery

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related