8 Replies Latest reply on Sep 1, 2009 5:29 AM by Andrew Rosewarn

    Passing array data into datagrid

    poojagupta Level 1

      Hi,

       

      I need to pass data from an Array ( of Strings) into a datagrid. I have used the following text:

       

      <mx:DataGrid id="dg1" x="400" y="50" dataProvider="{myArray}">

      <mx:columns>

                <mx:DataGridColumn headerText="Names" />

      </mx:columns>

      </mx:DataGrid>

       

      The DataGrid does not show any data as I have not mentioned the dataField. Can you please tell - what woud the dataField be in this case as the array contains simple strings.

        • 1. Re: Passing array data into datagrid
          flexprad09 Level 2

          Hi Pooja,

           

          Use an ArrayCollection not an Array.
          In general, you should always use ArrayCollections when binding to dataProviders of DataGrids,ADG's etc since they are property-change aware and will inform the List whenever objects are added, removed or changed within them.
          Arrays do not provide this behavior.

           

          Hope this link  helps you.

           

          http://livedocs.adobe.com/flex/3/html/help.html?content=dpcontrols_6.html

           

          If this post answers your question or helps, please mark it as such.

           

          cheers,

           

          Prad

          1 person found this helpful
          • 2. Re: Passing array data into datagrid
            Andrew Rosewarn Level 3

            Use an arrayCollection instead of an array.  If you want your array still set the arrayCollections source as your array.

             

            Datafield will use the string as a default for the dataField.

             

            <?xml version="1.0" encoding="utf-8"?>
            <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" initialize="init()" >
                    <mx:Script>
                    <![CDATA[
                        import mx.collections.ArrayCollection;
                       
                        private var myArray:Array = new Array('Andrew','Chris','John');
                       
                        [Bindable]
                        private var ac:ArrayCollection = new ArrayCollection();
                       
                        private function init():void {
                            ac.source = myArray;
                        }
                       
                    ]]>
                </mx:Script>
               
                <mx:DataGrid id="dg1" x="10" y="10" dataProvider="{ac}" width="184" height="165">
                    <mx:columns>
                        <mx:DataGridColumn headerText="Names"/>
                    </mx:columns>

             

            </mx:DataGrid>

             


            </mx:Application>

             

            Andrew

            • 3. Re: Passing array data into datagrid
              poojagupta Level 1

              Hi Prad,

               

              Thanks for the quick reply. But my problem still persists.

               

              The elements of my array (which are just simple strings) are determined at runtime. I tried using an array collection, but no change.

               

              I changed my code as follows.

               

              <mx:DataGrid id="dg1" x="400" y="50" dataProvider="{myAC}" />

               

              myAC is the new Array Collection.

               

              Any help would be great.

              • 4. Re: Passing array data into datagrid
                flexprad09 Level 2

                There is no problem in constructing arrays of strings at runtime and adding to AC [just that you need to give field name to each item of arrays].

                I am not getting your problem exactly.

                It would be better if you could boil down your code to understandable  few lines and paste.

                 

                Cheers,

                Prad.

                • 5. Re: Passing array data into datagrid
                  poojagupta Level 1

                  Hey Prad,

                   

                  I guess you have narrowed down the problem.

                   

                  "How do I give a dataField name to my Array elements."

                   

                  Thanks.

                   

                  Pooja

                  • 6. Re: Passing array data into datagrid
                    Andrew Rosewarn Level 3

                    When you come to assemble your arrayCollection with data you should create an object for each item

                     

                    var obj:Object = new Object();

                    obj.myName = 'Andrew';

                    arrayCollection.addItem(obj);

                     

                    Then your dataField property can call myName.  dataField="myName"

                     

                    Andrew

                    1 person found this helpful
                    • 7. Re: Passing array data into datagrid
                      poojagupta Level 1

                      Hey Andrew,

                       

                      That piece of code was helpful. Now, I have started viewing some data in the datagrid. However, this data is stil incomplete...so guess i need to delve a bit more into code..

                       

                      Thanx a lot.

                       

                      Regards,

                      Pooja

                      • 8. Re: Passing array data into datagrid
                        Andrew Rosewarn Level 3

                        Because your adding an Object to the arrayCollection you can add as many field names as you like as below.

                         

                        <?xml version="1.0" encoding="utf-8"?>
                        <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
                            <mx:Script>
                                <![CDATA[
                                    import mx.collections.ArrayCollection;
                                   
                                    [Bindable]
                                    private var ac:ArrayCollection = new ArrayCollection();
                                   
                                    private function init():void {
                                        var obj:Object = new Object();
                                        obj.name = 'Andrew';
                                        obj.town = 'Taunton';
                                        obj.sex = 'Male';
                                       
                                        var obj1:Object = new Object();
                                        obj1.name = 'Jane';
                                        obj1.town = 'Glastongury';
                                        obj1.sex = 'Female';
                                       
                                        ac.addItem(obj);
                                        ac.addItem(obj1);       
                                    }
                                ]]>
                            </mx:Script>
                            <mx:DataGrid x="42" y="47" dataProvider="{ac}">
                                <mx:columns>
                                    <mx:DataGridColumn headerText="Name" dataField="name"/>
                                    <mx:DataGridColumn headerText="Town" dataField="town"/>
                                    <mx:DataGridColumn headerText="Sex" dataField="sex"/>
                                </mx:columns>
                            </mx:DataGrid>
                        </mx:Application>

                         

                        In yours you just need to loop through your data source and create the objects and add them to the collection.

                         

                        Andrew