JSON - Iteration over nested data

Question

I have a JSON file which is structured as follows :

{"products":[
    { "tvs":[
        {"samsung":[
            {"leds":[
                {
                 "product_id": "034567",
                 "product_name": "Samsung UA22F5100 22'' LED TV (Black)",
                 "model_no": "UA22F5100",
                 "brand": "Samsung",
                 "price": 399,
                 "screen_size": 22,
                 "screen_res": "1920 x 1080",
                 "usb": 1,
                 "hdmi": 1,
                 "screen_format": "LED",
                 "dimensions": "513.1 x 366.5 x 169.6",
                 "manuf_guarantee": "1 year"                  
                },
                {
                 "product_id": "012468",
                 "product_name": "Samsung 23F4003 23'' LED TV (Black)",
                 "model_no": "23F4003",
                 "brand": "Samsung",
                 "price": 459,
                 "screen_size": 23,
                 "screen_res": "1366 x 768 pixels",
                 "usb": 1,
                 "hdmi": 1,
                 "screen_format": "LED",
                 "dimensions": "551.9 x 368.4 x 123.4",
                 "manuf_guarantee": "1 year"                
                }
        ]},
        {"plasma":[
            {
             "product_id": "043291",
             "product_name": "Samsung 43F4100 43'' Plasma TV (Black)",
             "model_no": "43F4100",
             "brand": "Samsung",
             "price": 399,
             "screen_size": 43,
             "screen_res": "852 x 480",
             "usb": 2,
             "hdmi": 2,
             "screen_format": "Plasma",
             "dimensions": "1007.4 x 670.5 x 261.9",
             "manuf_guarantee": "1 year"                 
           },
                etc...

I need to iterate over this after I retrieve the results from an ajax request. I would need to filter data for example, get only leds' objects. What is the best way to filter : should I use jquery's .each(), or a for in loop ?

I am trying to iterate it using the .each() approach, but I am stuck on the part where I need to check if current object is 'leds' or 'plasma'.

On the other hand, if I use for (var x in obj), I get access to the name of the object through 'x' ..

So should I do it using for in loop? and how exactly would I do it?

maxime1992 · Accepted Answer · 2014-04-09 12:40:55Z

1

Assuming that data contains your json

data.each(function(index, product) {
   product.each(function(index, tv) {
      tv.each(function(index, mark) {
         mark.each(function(index, type) {
            if (type=='leds') {
               // Do whatever you want ...
            }
         });
      });
   });
});

EDIT : Full with AJAX call

var obj = {};
obj.my_post_value = my_post_value;

var str = jQuery.param(obj);

$.ajax({
    type: "POST",
    url: 'my_url',
    dataType: 'json',
    data: str,
    success: function (data) {
        // handle your successful stuff here
        data.each(function(index, product) {
           product.each(function(index, tv) {
              tv.each(function(index, mark) {
                 mark.each(function(index, type) {
                    if (type=='leds') {
                       // Do whatever you want ...
                    }
                 });
              });
           });
        });
    },
    error: function (data) {
        // handle your unsuccessful stuff here
    }
});

edited Apr 9, 2014 at 12:40

answered Apr 9, 2014 at 12:17

maxime1992

24k11 gold badges90 silver badges133 bronze badges

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

10 Comments

LogixMaster Over a year ago

tahnks for your answer? Does this require me to parse them into a jquery object to use .each() ? I ve tried this but it doesn't really work.

maxime1992 Over a year ago

it depends how do you get the data. AJAX ?

LogixMaster Over a year ago

currently i'm using getJSON() method, but was thinking of using $.ajax with get request, as I need to control what happens on success, failure etc, so yes AJAX

maxime1992 Over a year ago

I just edited my comment with a full ajax call in JQuery ;) If you do not need to pass value, just delete lines before $.ajax ... And in $.ajax delete line "data: str,"

LogixMaster Over a year ago

I dont think type can equate to leds.. as its comparing an object with string.. Correct me if im wrong :) jsfiddle.net/XkXU4/3

|

Asik · Accepted Answer · 2014-04-09 13:15:04Z

1

This is the solution from native javascript.

<html>
<script>
var jsonArray = {"products":[
    { "tvs":[
        {"samsung":[
            {"leds":[
                {
                 "product_id": "034567",
                 "product_name": "Samsung UA22F5100 22'' LED TV (Black)",
                 "model_no": "UA22F5100",
                 "brand": "Samsung",
                 "price": 399,
                 "screen_size": 22,
                 "screen_res": "1920 x 1080",
                 "usb": 1,
                 "hdmi": 1,
                 "screen_format": "LED",
                 "dimensions": "513.1 x 366.5 x 169.6",
                 "manuf_guarantee": "1 year"                  
                },
                {
                 "product_id": "012468",
                 "product_name": "Samsung 23F4003 23'' LED TV (Black)",
                 "model_no": "23F4003",
                 "brand": "Samsung",
                 "price": 459,
                 "screen_size": 23,
                 "screen_res": "1366 x 768 pixels",
                 "usb": 1,
                 "hdmi": 1,
                 "screen_format": "LED",
                 "dimensions": "551.9 x 368.4 x 123.4",
                 "manuf_guarantee": "1 year"                
                }
        ]},
        {"plasma":[
                {
                 "product_id": "043291",
                 "product_name": "Samsung 43F4100 43'' Plasma TV (Black)",
                 "model_no": "43F4100",
                 "brand": "Samsung",
                 "price": 399,
                 "screen_size": 43,
                 "screen_res": "852 x 480",
                 "usb": 2,
                 "hdmi": 2,
                 "screen_format": "Plasma",
                 "dimensions": "1007.4 x 670.5 x 261.9",
                 "manuf_guarantee": "1 year"                 
               }
           ]
        }
        ]
}]
}]
};      

var brand = "samsung"; //I assume that you know, how to get this based on your design
var type = "leds"; //I assume that you know, how to get this based on your design

var typeArray = eval("jsonArray.products[0].tvs[0]."+brand+"[0]."+type);
if(typeArray .length){
    for(var i=0; i<typeArray .length; i++){
        var product_id = typeArray [i].product_id;
        alert(product_id);
    }
}
</script>
<body>                       
</body>
</html>

edited Apr 9, 2014 at 13:15

answered Apr 9, 2014 at 12:22

Asik

7,9674 gold badges30 silver badges35 bronze badges

7 Comments

LogixMaster Over a year ago

Hi Asik, this works great an its so simple! However I d like something a little bit more dynamic.. for instance at some point, I would like to filter for samsung Leds, and in another point, i'd like to filter for Sony plasma's.. should I just use some javascipt to pass in the keys (ie samsung, sony or an other brand?) and then use string concatenation ? Is that a good approach ?

George Stocker Over a year ago

@user2678538 If you have a new question, ask a new question.

maxime1992 Over a year ago

My comment in JQuery is a dynamic approach ;)

LogixMaster Over a year ago

@Maxime I like how iterating over objects can be more flexible, if I could just get it to work

Asik Over a year ago

@user2678538, yes you can...I have updated my post..see that, it may be useful for you. Good Luck!!

|

Collectives™ on Stack Overflow

JSON - Iteration over nested data

2 Answers 2

10 Comments

7 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

10 Comments

7 Comments

Your Answer

Sign up or log in

Post as a guest

Related