13 Replies Latest reply on Sep 14, 2009 3:06 PM by cyber0897

    tree component children displays [Object, Object] need help displaying the names :)

    cyber0897 Level 1

      hey guys... i've run into yet another problem...

      i have a tree component that gets its data from a httpservice.. xml file.

       

      i then pasrse thru the recieved xml to create a dataprovider for the tree component. the code for that is below...

       

      <mx:Tree id="tree" dataProvider="{treeData2}" showRoot="false" width="50%" height="100%" />

       

      [Bindable] public var treeData2:ArrayCollection = new ArrayCollection;
      [Bindable] public var treeData:Object;
      public var resultArr:Object;
      public function initNavTab():void{
          var navService:HTTPService = new HTTPService();
          navService.url = "http://www.apxalarm.com/pages/getnav";
          navService.method = "POST";
          navService.useProxy = false;
          navService.resultFormat = "e4x";
          //navService.resultFormat = "array";
          navService.addEventListener(ResultEvent.RESULT, returnNavData);
          navService.addEventListener(FaultEvent.FAULT, navDataFault);
          navService.send();
      }

       

      public function returnNavData(event:ResultEvent):void{
          navData = event.result;
          //resultArr = event.result;
          Alert.show("load complete");
          tree_labelFunc(navData);
      }

       

      public function navDataFault(event:FaultEvent):void{
          Alert.show(event.fault.faultDetail);
      }

       

      public function tree_labelFunc(item:Object):void{
          var node:XML = XML(item);
          var nav:XMLList = new XMLList();
          nav = node.sections;
          var i:Number = 0;

       

          for each (var section:XML in nav.section){
              var obj:Object = new Object();
              obj.label = section.name;
              obj.urlName = section.urlName;
              obj.children = new ArrayCollection;
                  for each(var nav1:XML in section.navs.nav){
                      obj.children.addItem([{label: nav1.name}]);
                  }
              treeData2.addItem(obj);
          }
      }

       


      the tree_labelFunc parces thru the xml and creates the appropriate structure i need to be displayed in the tree component... but unfortunately the children of the tree component only shows [Object, Object]

      can someone show me how to display the labels instead of the Object???

       

      thank you soo much in advace guys!!! i really appretiate it!!!

       

      oh and this is part of the xml that it is pulling

       

      <siteMap>
        <sections>
          <section>
            <name>About APX</name>
            <urlName>about</urlName>
            <position>1</position>
            <defaultaction>/about/mission</defaultaction>
            <navs>
              <nav>
                <name>Our Mission</name>
                <urlName>mission</urlName>
                <position>1</position>
                <defaultaction>13</defaultaction>
                <subNavs/>
              </nav>
              <nav>
                <name>Links</name>
                <urlName>links</urlName>
                <position>4</position>
                <subNavs>
                  <nav>
                    <name>iamapx.com</name>
                    <urlName>iamapx</urlName>
                    <position>1</position>
                    <defaultaction>http://www.iamapx.com</defaultaction>
                    <subNavs/>
                  </nav>
                  <nav>
                    <name>apxgivesback.com</name>
                    <urlName>agb</urlName>
                    <position>2</position>
                    <defaultaction>http://www.apxgivesback.com</defaultaction>
                    <subNavs/>
                  </nav>
                </subNavs>
              </nav>
              <nav>
                <name>Newsletter</name>
                <urlName>newsletter</urlName>
                <position>3</position>
                <defaultaction>37</defaultaction>
                <subNavs/>
              </nav>
            </navs>
          </section>
          <section>
          …
          ...
          ...
          </section>
          <section>
          …
          ...
          ...
          </section>
          <section>
          …
          ...
          ...
          </section>
          <section>
          …
          ...
          ...
          </section>
          <section>
          …
          ...   
          ...
          </section>
        </sections>
      </siteMap>

       

       

      i need the name tags in the xml to be displayed in the tree component....

       

       

      again thank you soo much in advace for your help!!

        • 1. Re: tree component children displays [Object, Object] need help displaying the names :)
          Flex harUI Adobe Employee

          Try:

           

                  obj.label = section.name.toString();

           

          and:

                          obj.children.addItem({label: nav1.name.toString()});

           

          Alex Harui

          Flex SDK Developer

          Adobe Systems Inc.

          Blog: http://blogs.adobe.com/aharui

          • 2. Re: tree component children displays [Object, Object] need help displaying the names :)
            cyber0897 Level 1

            YESS!!! alex!! thank you soooo much!!! that worked like a champ!!!   you are a life saver!!!!

            • 3. Re: tree component children displays [Object, Object] need help displaying the names :)
              cyber0897 Level 1

              hey Alex.. i have just one more question....

               

              in the xml i have in my original post, there is a subNav tag... im trying to incorporate taht inside my xmlparsing but i have no idea how to do it...

               

              i tried modifying my tree_labelFunc and i have to updated code below... but unfortuately i am still unable to do what i need.

               

              i basically need obj to have children, and the children to have subnavs.

               

              public function tree_labelFunc(item:Object):void{
                  var node:XML = XML(item);
                  var nav:XMLList = new XMLList();
                  nav = node.sections;
                  var i:Number = 0;
                  //trace(nav);
                  for each (var section:XML in nav.section){
                      var obj:Object = new Object();
                      obj.label = section.name.toString();
                      obj.urlName = section.urlName;
                      //obj.children = new Object;
                      obj.children = new ArrayCollection;
                          for each(var nav1:XML in section.navs.nav){
                              //obj.children.addItem([{label: nav1.name}]);
                              //obj.children = new Object;
                              obj.children.addItem({label: nav1.name.toString()});;
                              if(nav1.subNavs.nav.length() > 0){
                                  obj.children.addItem({subNav: new ArrayCollection});
                                      for each(var nav2:XML in nav1.subNavs.nav){
                                          obj.children.addItem({subNav.addItem({label: nav2.name.toString()})});
                                      }
                              }
                          }
                      treeData2.addItem(obj);
                  }

               

                  trace(treeData2);
              }

               

              i keep getting errors that say subNav is undefined.

               

              if you have any ideas, that would be superbly helpful!! again thank you soo much !

              • 4. Re: tree component children displays [Object, Object] need help displaying the names :)
                Flex harUI Adobe Employee

                It depends on what the XML looks like.  Trace out node.toXMLString() and post it

                 

                Alex Harui

                Flex SDK Developer

                Adobe Systems Inc.

                Blog: http://blogs.adobe.com/aharui

                • 5. Re: tree component children displays [Object, Object] need help displaying the names :)
                  cyber0897 Level 1

                  thank you soo much for your quick responce alex!!

                   

                  the toXMLString is exactly like the xml

                   

                  <siteMap>
                    <sections>
                      <section>
                        <name>About APX</name>
                        <urlName>about</urlName>
                        <position>1</position>
                        <defaultaction>/about/mission</defaultaction>
                        <navs>
                          <nav>
                            <name>Our Mission</name>
                            <urlName>mission</urlName>
                            <position>1</position>
                            <defaultaction>13</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Links</name>
                            <urlName>links</urlName>
                            <position>4</position>
                            <subNavs>
                              <nav>
                                <name>iamapx.com</name>
                                <urlName>iamapx</urlName>
                                <position>1</position>
                                <defaultaction>http://www.iamapx.com</defaultaction>
                                <subNavs/>
                              </nav>
                              <nav>
                                <name>apxgivesback.com</name>
                                <urlName>agb</urlName>
                                <position>2</position>
                                <defaultaction>http://www.apxgivesback.com</defaultaction>
                                <subNavs/>
                              </nav>
                            </subNavs>
                          </nav>
                          <nav>
                            <name>Newsletter</name>
                            <urlName>newsletter</urlName>
                            <position>3</position>
                            <defaultaction>37</defaultaction>
                            <subNavs/>
                          </nav>
                        </navs>
                      </section>
                      <section>
                        <name>APX Security Systems</name>
                        <urlName>apxsystems</urlName>
                        <position>2</position>
                        <defaultaction>/apxsystems/systems/products</defaultaction>
                        <navs>
                          <nav>
                            <name>Service Areas</name>
                            <urlName>serviceareas</urlName>
                            <position>1</position>
                            <defaultaction>25</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Systems</name>
                            <urlName>systems</urlName>
                            <position>2</position>
                            <defaultaction>27</defaultaction>
                            <subNavs>
                              <nav>
                                <name>Get A System</name>
                                <urlName>get</urlName>
                                <position>2</position>
                                <defaultaction>27</defaultaction>
                                <subNavs/>
                              </nav>
                              <nav>
                                <name>Browse Products</name>
                                <urlName>products</urlName>
                                <position>1</position>
                                <defaultaction>28</defaultaction>
                                <subNavs/>
                              </nav>
                              <nav>
                                <name>Refer A Friend</name>
                                <urlName>refer</urlName>
                                <position>3</position>
                                <defaultaction>38</defaultaction>
                                <subNavs/>
                              </nav>
                            </subNavs>
                          </nav>
                        </navs>
                      </section>
                      <section>
                        <name>Customer Support</name>
                        <urlName>support</urlName>
                        <position>3</position>
                        <defaultaction>/support/specialist</defaultaction>
                        <navs>
                          <nav>
                            <name>Technical Support</name>
                            <urlName>tech</urlName>
                            <position>2</position>
                            <defaultaction>32</defaultaction>
                            <subNavs>
                              <nav>
                                <name>Troubleshooting</name>
                                <urlName>troubleshooting</urlName>
                                <position>2</position>
                                <defaultaction>32</defaultaction>
                                <subNavs/>
                              </nav>
                            </subNavs>
                          </nav>
                          <nav>
                            <name>Speak To A Specialist</name>
                            <urlName>specialist</urlName>
                            <position>1</position>
                            <defaultaction>30</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Move Options</name>
                            <urlName>moves</urlName>
                            <position>3</position>
                            <defaultaction>35</defaultaction>
                            <subNavs/>
                          </nav>
                        </navs>
                      </section>
                      <section>
                        <name>Home Safety</name>
                        <urlName>safety</urlName>
                        <position>4</position>
                        <defaultaction>/safety/outside</defaultaction>
                        <navs>
                          <nav>
                            <name>Indoor Tips</name>
                            <urlName>inside</urlName>
                            <position>1</position>
                            <defaultaction>17</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Outdoor Tips</name>
                            <urlName>outside</urlName>
                            <position>2</position>
                            <defaultaction>18</defaultaction>
                            <subNavs/>
                          </nav>
                        </navs>
                      </section>
                      <section>
                        <name>Customer Stories</name>
                        <urlName>stories</urlName>
                        <position>5</position>
                        <defaultaction>/stories/videos</defaultaction>
                        <navs>
                          <nav>
                            <name>Videos</name>
                            <urlName>videos</urlName>
                            <position>3</position>
                            <defaultaction>15</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Read Stories</name>
                            <urlName>read</urlName>
                            <position>1</position>
                            <defaultaction>19</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Tell Your Story</name>
                            <urlName>tell</urlName>
                            <position>2</position>
                            <defaultaction>20</defaultaction>
                            <subNavs/>
                          </nav>
                        </navs>
                      </section>
                      <section>
                        <name>Newsroom</name>
                        <urlName>press</urlName>
                        <position>6</position>
                        <defaultaction>/press/compprofile</defaultaction>
                        <navs>
                          <nav>
                            <name>Press Releases</name>
                            <urlName>pr</urlName>
                            <position>2</position>
                            <defaultaction>21</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Media Kit</name>
                            <urlName>media</urlName>
                            <position>3</position>
                            <defaultaction>22</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Company Profile</name>
                            <urlName>compprofile</urlName>
                            <position>1</position>
                            <defaultaction>34</defaultaction>
                            <subNavs/>
                          </nav>
                          <nav>
                            <name>Contact Us</name>
                            <urlName>contact</urlName>
                            <position>4</position>
                            <defaultaction>39</defaultaction>
                            <subNavs/>
                          </nav>
                        </navs>
                      </section>
                    </sections>
                  </siteMap>

                   

                  i need to subNavs to be available within the tree dropdown...

                  • 6. Re: tree component children displays [Object, Object] need help displaying the names :)
                    Flex harUI Adobe Employee

                    Some of the subNav's are empty so subNav.nav.length() will fail.

                     

                    You probably want to test for subNav.length()

                     

                    Alex Harui

                    Flex SDK Developer

                    Adobe Systems Inc.

                    Blog: http://blogs.adobe.com/aharui

                    • 7. Re: tree component children displays [Object, Object] need help displaying the names :)
                      cyber0897 Level 1

                      i tried doing trace(nav1.subNavs.length()); and i got "1" for every single subNav... but when i did trace(nav1.subNav.nav.length()); i got

                      0,2,0,0,3,1,0,0,0,0,0,0,0,0,0,0,0

                       

                      to add the subnavs to my tree i tried doing,

                       

                      public function tree_labelFunc(item:Object):void{
                          var node:XML = XML(item);
                          var nav:XMLList = new XMLList();
                          nav = node.sections;
                          var i:Number = 0;

                          for each (var section:XML in nav.section){
                              var obj:Object = new Object();
                              obj.label = section.name.toString();
                              obj.urlName = section.urlName;
                              obj.children = new ArrayCollection;
                                  for each(var nav1:XML in section.navs.nav){

                                      obj.children.addItem({label: nav1.name.toString()});
                                      if(nav1.subNavs.nav.length() > 0){
                                          var nav2Obj:Object = new Object();                                      //<------------------
                                              for each(var nav2:XML in nav1.subNavs.nav){
                                                  nav2Obj.label = nav2.name.toString();                         //<------------------
                                              }
                                      }
                                      obj.children.addItem({subNav: nav2Obj});                                //<------------------
                                  }
                              treeData2.addItem(obj);
                          }

                       

                          trace(treeData2);
                      }

                       

                       

                      but that failed lol

                      • 8. Re: tree component children displays [Object, Object] need help displaying the names :)
                        Flex harUI Adobe Employee

                        Ok, that sounds right.  It looks like you're not creating new objects inside the loop.

                         

                        Alex Harui

                        Flex SDK Developer

                        Adobe Systems Inc.

                        Blog: http://blogs.adobe.com/aharui

                        • 9. Re: tree component children displays [Object, Object] need help displaying the names :)
                          cyber0897 Level 1

                          hey Alex, i still keep getting the [Object, Object]

                          i have the following code, and the attached image is the result of that

                           

                          public function tree_labelFunc(item:Object):void{
                              var node:XML = XML(item);
                              var nav:XMLList = new XMLList();
                              nav = node.sections;
                              var i:Number = 0;
                              //trace(nav);
                              for each (var section:XML in nav.section){
                                  var obj:Object = new Object();
                                  obj.label = section.name.toString();
                                  obj.urlName = section.urlName;
                                  //obj.children = new Object;
                                  obj.children = new ArrayCollection;
                                      for each(var nav1:XML in section.navs.nav){
                                          //obj.children.addItem([{label: nav1.name}]);
                                          //obj.children = new Object;
                                          obj.children.addItem({label: nav1.name.toString()});
                                          if(nav1.subNavs.nav.length() > 0){
                                              var nav2Obj:Object = new Object();
                                                  for each(var nav2:XML in nav1.subNavs.nav){
                                                      nav2Obj.children = new Object();
                                                      nav2Obj.children.label = nav2.name.toString();
                                                  }
                                              obj.children.addItem({subNav: nav2Obj});
                                          }
                                      }
                                  treeData2.addItem(obj);
                              }

                           

                              trace(treeData2);
                          }

                          • 10. Re: tree component children displays [Object, Object] need help displaying the names :)
                            Flex harUI Adobe Employee

                            I suggest you step through with the debugger.  The children property of a node should be an ArrayCollection of objects with label properties.  It doesn't look like you're headed in that direction anymore.

                             

                            Alex Harui

                            Flex SDK Developer

                            Adobe Systems Inc.

                            Blog: http://blogs.adobe.com/aharui

                            • 11. Re: tree component children displays [Object, Object] need help displaying the names :)
                              cyber0897 Level 1

                              hey Alex... sorry about the late reply... i didnt work this weekend...

                               

                              the logic in the function seems to be working pretty good... its just the matter of how to save/parse the data...

                               

                              i did a bunch of traces on the function....

                               

                              public function tree_labelFunc(item:Object):void{
                                  var node:XML = XML(item);
                                  var nav:XMLList = new XMLList();
                                  nav = node.sections;
                                  var i:Number = 0;
                                  //trace(nav);
                                  for each (var section:XML in nav.section){
                                      var obj:Object = new Object();
                                      trace(section.name.toString());
                                      obj.label = section.name.toString();
                                      obj.urlName = section.urlName;
                                      //obj.children = new Object;
                                      obj.children = new ArrayCollection;
                                          for each(var nav1:XML in section.navs.nav){
                                              trace("---- " + nav1.name.toString());
                                              obj.children.addItem({label: nav1.name.toString()});
                                              if(nav1.subNavs.nav.length() > 0){
                                                  //var nav2Obj:Object = new Object();
                                                      for each(var nav2:XML in nav1.subNavs.nav){
                                                          //nav2Obj.children = new Object();
                                                          //nav2Obj.children.label = nav2.name.toString();
                                                          trace("-------- " + nav2.name.toString());
                                                      }
                                                  //obj.children.addItem({subNav: nav2Obj});
                                              }
                                          }
                                      treeData2.addItem(obj);
                                  }

                              }

                               

                              as you can see... i tried to have the function output data in a tree like manner... This is the result of the traces...

                               

                              About APX
                              ---- Our Mission
                              ---- Links
                              -------- iamapx.com
                              -------- apxgivesback.com
                              ---- Newsletter
                              APX Security Systems
                              ---- Service Areas
                              ---- Systems
                              -------- Get A System
                              -------- Browse Products
                              -------- Refer A Friend
                              Customer Support
                              ---- Technical Support
                              -------- Troubleshooting
                              ---- Speak To A Specialist
                              ---- Move Options
                              Home Safety
                              ---- Indoor Tips
                              ---- Outdoor Tips
                              Customer Stories
                              ---- Videos
                              ---- Read Stories
                              ---- Tell Your Story
                              Newsroom
                              ---- Press Releases
                              ---- Media Kit
                              ---- Company Profile
                              ---- Contact Us

                               

                              it seems to be parsing the children's children correctly...

                               

                              do you know of any datatypes i guess, that would make this a little easier??

                               

                              or if you have any ideas on how to fix my existing code to get the parsing working that would be great!! i would and still really really appretiate your help!

                              i have been wracking my braing on this but with no avail...

                               

                              again thank you soo much!

                              • 12. Re: tree component children displays [Object, Object] need help displaying the names :)
                                Flex harUI Adobe Employee

                                The innermost loop doesn't look like it is creating an array collection of children.  You can use the debugger to expand your object hierarchy and see.  Each children property at each level must be an arraycollection, and each object must have a label property.  I think it would have to look more like this:

                                 

                                        obj.children = new ArrayCollection;

                                            for each(var nav1:XML in section.navs.nav){

                                                trace("---- " + nav1.name.toString());

                                                var nav1Obj:Object = {label: nav1.name.toString()};

                                                obj.children.addItem(nav1Obj);

                                                if(nav1.subNavs.nav.length() > 0){

                                                    nav1Obj.children = new ArrayCollection();

                                                    for each(var nav2:XML in nav1.subNavs.nav){

                                                        nav1Obj.children.addItem({label: nav2.name.toString()});

                                                    }

                                                }

                                            }

                                        treeData2.addItem(obj);

                                 

                                Alex Harui

                                Flex SDK Developer

                                Adobe Systems Inc.

                                Blog: http://blogs.adobe.com/aharui

                                1 person found this helpful
                                • 13. Re: tree component children displays [Object, Object] need help displaying the names :)
                                  cyber0897 Level 1

                                  YES! thank you soo much!!! that worked perfectly!!