jquery reading nested json

Question

I have the following json as seen below. I'm trying to read the values TOP1, TOP2. I'm a little unsure of how to do this.

I'm using the following .. But that just gets me an object which has the nested objects for TOP1 and TOP2. How do I get the values TOP1 and TOP2 ??

$.getJSON('http://localhost/data/menufixed.json',
    function(data) {            
        $.each(data, function(entryIndex, entry) {
            var html = '<li class="top-level">';

        });
    });

And the data below

{
"actions" : [
    {
        "action": "TOP1",
        "subaction": [
            {
                "name": "A" 
            },
            {
                "name": "B" 
            },
            {
                "name": "C" 
            } 
        ] 
    },
    {
        "action": "TOP2",
        "subaction": [
            {
                "name": "X" 
            },
            {
                "name": "Y" 
            } 
        ]

score 12 · Accepted Answer · answered Oct 25 '10 at 17:19

12

It looks like you want to loop though the .actions, so change this:

$.each(data, function(entryIndex, entry) {
  var html = '<li class="top-level">';
});

To this:

$.each(data.actions, function(entryIndex, entry) {
  var html = '<li class="top-level">' + this.action + '</li>';
});

Using data.actions you're now looping through that array of objects, and those objects are the ones with the .action property, for example: "TOP1" and "TOP2".

answered Oct 25 '10 at 17:19

Nick Craver

623,446
136
1,297
1,155

This is what im after thanks Nick! How might I access the ABC / YX data ? – wmitchell Oct 26 '10 at 09:30
4

@imerez - *Inside* the `$.each()` callback above, you would do `$.each(this.subaction, function() { alert(this.name); });`, that would give you A, B, C, etc. - test it out here: http://www.jsfiddle.net/nick_craver/mHvvA/2/ – Nick Craver Oct 26 '10 at 09:31
Thanks thats what Im after .. thanks for the excellent resource jsfiddle also :P – wmitchell Oct 26 '10 at 13:13

score 1 · Answer 2 · answered Jul 01 '20 at 10:39

After 10 years i'm answering this equation. Using multidimensional array of objects, the inner value can be retrieved.

$(document).ready(function() {
    $.each(data.actions, function(i, elementText) { 
    displayHTML += '<div><h2>' +elementText.action+ '</h2></div>';

  $.each(elementText.subaction, function(j, elementSubText) { 
  displayHTML += '<li><span>' +elementSubText.name+'</span></li>';
  });
});
$("#listing").append(displayHTML);
});

Here is the fiddle link : https://jsfiddle.net/ssuryar/h9vxeuzn/ - JSFIDDLE

jquery reading nested json

2 Answers2

Linked

Related