Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery reading nested json

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" 
            } 
        ] 
like image 707
wmitchell Avatar asked Oct 25 '10 17:10

wmitchell


2 Answers

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

like image 189
Surya R Praveen Avatar answered Nov 20 '22 15:11

Surya R Praveen


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".

like image 27
Nick Craver Avatar answered Nov 20 '22 15:11

Nick Craver