How to iterate through nested array of JSON in jQuery?

Question

I have a data in json format getting from PHP script the data is coming in following format as follows:

[{
"type":"checkbox",
"grid-name":"Sports",
"values":["Cricket","Football"],
 "input":[{"Cricket":2},{"Football":1}]
},
{"type":"checkbox",
"grid-name":"Hobbies",
"values":["Playing Chess","Swimming"],
"input":[{"Playing Chess":1},{"Swimming":2}]
},
{"type":"radiobutton",
"grid-name":"Gender",
 "values":["Male","Female"],
"input":[{"Male":3},{"Female":0}]
},
{"type":"radiobutton",
"grid-name":"Citizen",
"values":["Indian","NRI"],
"input":[{"Indian":3},{"NRI":0}]
},
{"type":"number",
"grid-name":"Age",
"input":["24","23","23"]
},
 {"type":"select",
"grid-name":"City",
"values":["Satara","New york","Korea"],
"input":[{"Satara":1},{"New york":1},{"Korea":1}]
}]

i want to capture the values & input array. How to access through nested array?

If you request the das with jQuery, and the server sends the correct information, then the JSON formatted String will be automatically parsed into a JavaScript Object. The Resulting array can be iterated using a normal for loop, or the forEach function provided by an Array. — t.niese
– t.niese, Commented Apr 16, 2015 at 6:23
Where do you need to capture it? There are many functions like each()/map() available. — Shaunak D
– Shaunak D, Commented Apr 16, 2015 at 6:25
probably i need to capture value & input data where value data is simple an array at the place of value whereas input is array inside array at the place of value — Shaggie
– Shaggie, Commented Apr 16, 2015 at 6:34

Community · Accepted Answer · 2017-05-23 12:08:47Z

1

jQuery:

$.each(yourObject, function( index, value ) {
    console.log(value.values);
    console.log(value.input);
});

Native js (but better don't use it, accordingly to this):

for (index in yourObject) {
    console.log(yourObject[index].values);
    console.log(yourObject[index].input);
}

Native js, another example:

for (var i = 0; i < yourObject.length; i++) {
    console.log(yourObject[i].values);
    console.log(yourObject[i].input);
}

edited May 23, 2017 at 12:08

CommunityBot

11 silver badge

answered Apr 16, 2015 at 6:23

cn0047

17.2k7 gold badges61 silver badges75 bronze badges

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

4 Comments

t.niese Over a year ago

The structure shown by the OP is an Array, and the OP also asks about Array, so you should not suggest a for-in loop or at least make clear that this should only be used for Objects (Why is using “for…in” with array iteration such a bad idea?)

Tushar Gupta Over a year ago

@t.niese agreed.. Foreach preffered.

cn0047 Over a year ago

inside your each you should write one more...

$.each(yourObject, function( index, value ) {     $.each(value.input, function( i, v ) {     /* Here code ... */     }); });

cn0047 Over a year ago

Added native js another example. I know, that it isn't actual already, but just for example...

Josh · Accepted Answer · 2015-04-16 06:22:30Z

0

You're looking for $.each. This will allow you to loop through object-arrays.

https://api.jquery.com/jquery.each/

If you're also asking how to capture the values and you have the raw text, you're also looking for $.parseJSON

https://api.jquery.com/jquery.parsejson/

answered Apr 16, 2015 at 6:22

Josh

3,2982 gold badges21 silver badges33 bronze badges

Collectives™ on Stack Overflow

How to iterate through nested array of JSON in jQuery?

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related