CODEWITHSUNDEEP
javascriptjsonobjectmootoolseach
XTRUST.ORG
XTRUST.ORG

Reputation: 3402

javascript JSON advanced

I can't find the bug. May be you can help me: My code is below:

var data  = {"product":[{"config":[{"id":"1","price":"100","sku":"10548796345","manufacturer":"Apple","name":"Product 1", "description":"Web site has two parts: the Site (which is what your site visitors see) and the Administrator (which is where you will want to do a lot of the site management). You need to log in to the Administrator separately. There is a link to the administrator on the top menu that you will see when you log .","cid":"1","qty":"102"}],"options":[{"color":[{"blue":"+10","count":"2"},{"red":"+20","count":"3"}]},{"size" :[{"S":"+10","count":"1"},{"M":"+20","count":"4"},{"L":"+30","count":"5"},{"XL":"+40","count":"2"}]}]},{"config":[{"id":"2","price":"100","sku":"10548796341","manufacturer":"Apple","name":"Product 2", "description":"Web site has two parts: the Site (which is what your site visitors see) and the Administrator (which is where you will want to do a lot of the site management). You need to log in to the Administrator separately. There is a link to the administrator on the top menu that you will see when you log in.","cid":"1","qty":"102"
}],"options":[{"color":[{"blue":"+10","count":"2"},{"red":"+20","count":"3"}]},{"size" :[{"S":"+10","count":"1"},{"M":"+20","count":"4"},{"L":"+30","count":"5"},{"XL":"+40","count":"2"}]}]}],"categories":[ {"id":1,"name":"Category 1", "description":"Category 1 description"}, {"id":2,"name":"Category 2", "description":"Category 2 description"}, {"id":3,"name":"Category 3", "description":"Category 3 description"}]};

Copy and paste this code to: http://json.parser.online.fr/

Code below are works.

  data.categories.each(function(c){
      var opt = new Option(c.name, c.id);               
      try {category_selector.add(opt, null)} catch (err) {category_selector.add(opt)}                          
    });

Why this code is not working as code above (return undefined):

data.product.each(function(p){

        var el = new Element('div.preview'),
            name = new Element('h3', {'html': '<a href="#!product/product?product_id='+parseInt(p.config.id)+'">' + p.config.name + '</a>'}).inject(el),
            desc = new Element('span', {'html': p.config.description}).inject(name, 'after');
            el.inject(container);   

});

P.S

If I edit my code to:

data.product.each(function(p, i){



                     var el = new Element('div.preview'),
                         name = new Element('h3', {'html': '<a href="#!product/product?product_id='+parseInt(p.config[i].id)+'">' + p.config[i].name + '</a>'}).inject(el);                         
                         el.inject(container);  

         });

It will return just 1 product and console error: p.config[i] is undefined...

P.S 2:

 data.obj[1].config.each(function(p){ 
// [1] - return first product; [2] - return second; How to return all 1 and 2?   

         var el = new Element('div.preview'),
         name = new Element('h3', {'html': '<a href="#!product/product?product_id='+parseInt(p.id)+'">' + p.name + '</a>'}).inject(el);

         el.inject(container);  

             });

Upvotes: 1

Views: 258

Answers (2)

XTRUST.ORG
XTRUST.ORG

Reputation: 3402

Working code is below:

for (var i=0;i<data.product.length;i++) {

                data.product[i].config.each(function(p){     

                     var el = new Element('div.preview'),
                         name = new Element('h3', {'html': '<a href="#!product/product?product_id='+parseInt(p.id)+'">' + p.name + '</a>'}).inject(el);
                         el.inject(container);  

                 });
          }

Thanks.

Upvotes: 1

Greg
Greg

Reputation: 3568

data.product.each will run the callback 2 times (because you have 2 objects inside). The first time, p will be the config object. The second time, it will be the options object.

You are doing things like p.config.id, this does not make sense when p is 'options'. It seems you do not need to use the each iterator at all ? Just use var p = data.product at the beginning, and remove the each iteration.

Upvotes: 0

Related Questions