9 Replies Latest reply on Nov 15, 2014 12:04 AM by Zoze

    How to index array of JSON

    Zoze Level 1

      Hi, I have this structure of JSON:

       

      {

          "Colors": [

              {

                  "1subcolor": [

                      {

                          "title": "1st color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "2subcolor": [

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "3subcolor": [

                      {

                          "title": "3nd color",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd color",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd color",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ]

              }

          ],

          "Handle": [

              {

                  "1subhandle": [

                      {

                          "title": "1st handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "2subhandle": [

                      {

                          "title": "2nd handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd handle",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "3subhandle": [

                      {

                          "title": "3nd handle",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd handle",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd color",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ]

              }

          ],

          "Access": [

              {

                  "1subacc": [

                      {

                          "title": "1st acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "1st acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "2subacc": [

                      {

                          "title": "2nd acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd color",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "2nd acc",

                          "description": "1st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ],

                  "3subacc": [

                      {

                          "title": "3nd acc",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd acc",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      },

                      {

                          "title": "3nd color",

                          "description": "3st Image",

                          "seira": "toy-B",

                          "image": "images/wheel_cool.png",

                          "largeimage": "images/wheel_cool.png"

                      }

                  ]

              }

          ]

      }

       

      I created dynamically the 3 buttons that I want, with the the names (Color, Handles, Accesories)

       

      $.getJSON(jsonfile, function(data){

                $.each(data, function (array, index) {

                console.log("first each",index, array);

                              $.each(index, function (k, value) {

                              console.log("second each",value);

             var s = stage.createChildSymbol("submenutemplate","menuofmodelscontents");

             var r = s.getSymbolElement();

                  s.$("sub").html(array);

       

      Now,how  can I make the above array to be indexed as 0,1,2 as i want to be able to create a click action on those buttons.

       

      And when I'll click for example Colors, the array 1st/2nd/3rdsubcolor to be displayed as title of a div and the objects of the same array to be displayed.

      My problem here is how to get the data of the above JSON which is in another dynamic symbol, to the created dynamic symbol submenutemplate, eg. (Colors, Handles, Accessories) and create dynamic symbol with the objects.

       

      here is the link to the files Dropbox - complex-json.zip

        • 1. Re: How to index array of JSON
          joel_pau Level 5

          Hi,

           

          What version are you using: Edge 5.0 or earlier?

          • 2. Re: How to index array of JSON
            Zoze Level 1

            Hi joel,

             

            version 4

            • 3. Re: How to index array of JSON
              joel_pau Level 5

              Ok. Here is a demo with a complex son (flickr json): flickrJSON.zip - Box. File runs with Edge 1.5 to 4 (not Edge 5.0).

              I will look at file within few hours.

              1 person found this helpful
              • 4. Re: How to index array of JSON
                Zoze Level 1

                Ok, I am looking also this flickrJSON to learn how is working.

                Thank you!

                • 5. Re: How to index array of JSON
                  Zoze Level 1

                  I changed the JSON structure as:

                   

                  [

                      {

                          "Colors": [

                              {

                                  "1subcolor": [

                                      {

                                          "title": "1st color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "2subcolor": [

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "3subcolor": [

                                      {

                                          "title": "3nd color",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd color",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd color",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              }

                          ]

                      },

                      {

                          "Handle": [

                              {

                                  "1subhandle": [

                                      {

                                          "title": "1st handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "2subhandle": [

                                      {

                                          "title": "2nd handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd handle",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "3subhandle": [

                                      {

                                          "title": "3nd handle",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd handle",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd color",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              }

                          ]

                      },

                      {

                          "Access": [

                              {

                                  "1subacc": [

                                      {

                                          "title": "1st acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "1st acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "2subacc": [

                                      {

                                          "title": "2nd acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd color",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "2nd acc",

                                          "description": "1st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              },

                              {

                                  "3subacc": [

                                      {

                                          "title": "3nd acc",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd acc",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      },

                                      {

                                          "title": "3nd color",

                                          "description": "3st Image",

                                          "seira": "toy-B",

                                          "image": "images/wheel_cool.png",

                                          "largeimage": "images/wheel_cool.png"

                                      }

                                  ]

                              }

                          ]

                      }

                  ]

                   

                   

                  and made the code like this:

                   

                  $.getJSON(jsonfile, function(data){

                            $.each(data, function (array, index) {

                            console.log("1st each",index, array);

                                       $.each(index, function (protoname, subindex) {

                                          console.log("2nd each",protoname, subindex);

                                          $.each(subindex, function (subname, subsubindex) {

                            console.log("3rd each",subname, subsubindex);

                            $.each(subsubindex, function (items, itemindex) {

                                 console.log("4th each",items, itemindex);

                   

                  ..............

                   

                   

                  My problem now is that when ChildSymbols are created it is showing multiplied by 3. I mean I can Colors Colors Colors , Handlers Handlers Handlers, Access Access Access.

                   

                  How can I make it to display only one time the title?

                   

                  If i don't have the 3rd and 4th each  then it is displayed ok. but...

                  • 6. Re: How to index array of JSON
                    Zoze Level 1

                    Hi Joel,

                     

                    I've changed it a little bit but still isn\t working as I want.

                     

                    If you have time please check it if you can help me, i've included some comments on sub.click

                     

                    Dropbox - complex-json.zip

                     

                     

                    Thnaks in advanced.

                    • 7. Re: How to index array of JSON
                      joel_pau Level 5

                      ok, i downloaded.

                      • 8. Re: How to index array of JSON
                        Zaxist Level 4

                        Hi Zoze

                        here is your answer:

                         

                        Dropbox - complex-json - fixed.rar

                         

                         

                        i also have 4 advice for you :

                         

                        1 - Take a very good Class or Read a lot of tutorials about JSON, your JSON Structure is awful !!

                        2 - Never Do Complex JSON Until you know what you are doing

                        3 - your Edge Animate Structure is also very awful to make JSON with it you need to learn how to work with edge animate, i advice you Lynda's Tutorials, can help you and in case you saw those Tutorial i advice you to see them again

                        4 - if we want to do some thing that we dont know much about it, its better to read a lot of book about it and see a lot of hours tutorials about it to understand what we want and how we should make, think a lot about what we want to have and create a flow chart and make a progress map or


                             the best way is to turn our project into some one's hands that knows what to do !!   

                         

                        if you want to grow up on jQuery and Edge Animate, Please Take my Advice very serious

                         

                        regards

                        Zaxist

                        • 9. Re: How to index array of JSON
                          Zoze Level 1

                          My Dear Zaxist,

                           

                          Thank you for your helpful advises and most important for your precious time that you spend for looking at this.


                          Even this update that you add in this project it will be an important tutorial for me as I'll try to understand it and make the project work as I have it on my mind! (Still it is at 10% of what I want to do)

                          You know some times you know how to do some things in theory but due to luck of experience it is difficult to accomplish it practical.


                          Please, I'd like to mention (from my point of view) that if someone want's to learn then I believe that will post in this forum to take a helpful answer to be able to continue to work but if wants a complete project then will post at other forums that is for this scope.

                           

                          A big THANK YOU for your help, advices,  guidance and also a big THANK YOU to all of the few members that are spending their time to give us some helpful advice to our problems.

                           

                          I hope someday to be as helpful as you!

                           

                           

                          Best regards,

                          Zoze