1 Reply Latest reply on Feb 2, 2013 10:37 PM by Abhishek Chaudhary

    Heirarchical ArrayCollection Syntax

    jfillman Level 1

      I am attempting to create a list based on heirarchical data, but I am struggling with the syntax to determine if there are children and how to reference and display them under a parent. I can do this with XML data(thanks to example from Alex Hauri), but I need to use an ArrayCollection.

       

       

      ArrayCollection:

         private var dpHierarchy:ArrayCollection = new ArrayCollection([

          {Region:"Southwest", children: [

           {Region:"Arizona", children: [

            {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},

            {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]}, 

           {Region:"Central California", children: [

            {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]}, 

           {Region:"Nevada", children: [

            {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]}, 

           {Region:"Northern California", children: [

            {Territory_Rep:"Lauren Ipsum", Actual:38805, Estimate:40000},

            {Territory_Rep:"T.R. Smith", Actual:55498, Estimate:40000}]}, 

           {Region:"Southern California", children: [

            {Territory_Rep:"Alice Treu", Actual:44985, Estimate:45000},

            {Territory_Rep:"Jane Grove", Actual:44913, Estimate:45000}]}

          ]},

          {Region:"Northwest", children: [

           {Region:"Washington", children: [

            {Territory_Rep:"Barbara Jennings", Actual:38865, Estimate:40000},

            {Territory_Rep:"Dana Binn", Actual:29885, Estimate:30000}]}, 

           {Region:"Oregon", children: [

            {Territory_Rep:"Joe Smith", Actual:29134, Estimate:30000}]}, 

           {Region:"Idaho", children: [

            {Territory_Rep:"Bethany Pittman", Actual:52888, Estimate:45000}]}, 

          ]}

         ]);

       

       

       

      List:

      <s:List width="400" top="53" left="0" bottom="84" id="lstChartList" dataProvider="{dpHierarchy}" labelField="Region">

        <s:itemRenderer>

         <fx:Component>

          <s:ItemRenderer dataChange="update()">

            <fx:Script>

            import spark.components.List;

            private function update():void

            {

             trace (List(owner).dataProvider[0].children);

           }

           </fx:Script>

           <s:layout>

            <s:HorizontalLayout />

           </s:layout>

           <s:Group id="spacer" />

           <s:Label id="labelDisplay" />

          </s:ItemRenderer>

         </fx:Component>

        </s:itemRenderer>

      </s:List>

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

       

        • 1. Re: Heirarchical ArrayCollection Syntax
          Abhishek Chaudhary Level 1

          Hi,

           

          XML way is very complex.

           

          Do this,

           

          Create a simple Plain Class

           

          public class DynamicHVO

                    {

                              public var id:Number;

                              public var name:String;

                              public var children:ArrayCollection = new ArrayCollection();

                    }

           

           

          Where Children is again collection of objects having name field.(Children is basically for storing heirarchical elements)

           

          Assign collection of this object as data provider to your list.