5 Replies Latest reply on Sep 21, 2010 3:20 AM by BhaskerChari

    How to filter Array collection

    vineet osho Level 1

      Hello Friends

                           i am making a small simple application in which i using a Datagrid and Array collection as a dataprovider.just like this.

       

                                            private var mainArrcollection:ArrayCollection = new ArrayCollection([
                                                                                                 {name:'vineet', rollno:'14', age:'24'},
                                                                                                 {name:'osho', rollno:'15', age:'34'},
                                                                                                 {name:'sharma', rollno:'16', age:'44'}
                                                                                                 ]);

       

      now i want to filter a particular data from that arraycollection.i means change the dataprovider to

                                         private var tempArrcollection:ArrayCollection = new ArrayCollection([
                                                                                                    {name:'osho', rollno:'15', age:'34'},
                                                                                                 ]);

       

      at some  button click and set that new array as a dataprovider to datagird and so on.can any body guides me how this feature acheive.

       

      Thank and Regards

          Vineet Osho

        • 1. Re: How to filter Array collection
          BhaskerChari Level 4

          Hi vineet osho,

           

          You can acheive this by writing a FilterFunction for the ArrayCollection ...as shown below..

           

          <?xml version="1.0" encoding="utf-8"?>
          <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
          <mx:Script>
            <![CDATA[
             import mx.collections.ArrayCollection;
             [Bindable]private var mainArrcollection:ArrayCollection = new ArrayCollection([
                                                                      {name:'vineet', rollno:'14', age:'24'},
                                                                      {name:'osho', rollno:'15', age:'34'},
                                                                      {name:'sharma', rollno:'16', age:'44'}
                                                                      ]);
                                                             
                private function filterArrayCollection():void
                {
                 mainArrcollection.filterFunction = filterArrayCollectionElements;
                 mainArrcollection.refresh();
                }
                private function filterArrayCollectionElements(item:Object):Boolean
             {
              return (item.name == "osho" && item.rollno == "15");
             }                                                        
            ]]>
          </mx:Script>
          <mx:Button id="btnFilter" label="Filter" click="filterArrayCollection();" />
          <mx:DataGrid id="dataGrid" dataProvider="{mainArrcollection}" x="10" y="177" visible="true">          
            <mx:columns>
             <mx:DataGridColumn  headerText="Name" dataField="name"/>           
             <mx:DataGridColumn dataField="rollno" headerText="Roll No" />           
             <mx:DataGridColumn dataField="age" headerText="Age" />
            </mx:columns>
          </mx:DataGrid>
          </mx:Application>

          Note: You can also acheive this by looping through the main array collection and pushing the items required in to a temporary arraycollection and assigning it to datatgrid again. However the above method is more efficient ...

           

          Thanks,

          Bhasker

          1 person found this helpful
          • 2. Re: How to filter Array collection
            vineet osho Level 1

            Thannks a ton bhasker for your quick and accurate reply.need a little more favour if instead of button i have combobox and on the basis of selected index i have to get the data from mainArraycollection?

            i just want to know how i can get child of array collection(array).i mean

                                               for 0 index name:'vineet', rollno:'14', age:'24' that part fetch and

                                                for 1 index name:'osho', rollno:'15', age:'34'   that part and so on.

            i know its too easy but i cant any clue for that.hope you will help out me .

             

            Thanks in advance

                vineet osho

            • 3. Re: How to filter Array collection
              BhaskerChari Level 4

              Hi Vineet,

               

              You can do something like this...

               

               

              <?xml version="1.0" encoding="utf-8"?>
              <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="onCreationComplete()">
              <mx:Script>
                <![CDATA[
                 import mx.utils.ObjectUtil;
                  import mx.collections.ArrayCollection;
                 [Bindable]private var mainArrcollection:ArrayCollection = new ArrayCollection([
                                                                          {name:'vineet', rollno:'14', age:'24'},
                                                                          {name:'osho', rollno:'15', age:'34'},
                                                                          {name:'sharma', rollno:'16', age:'44'}
                                                                          ]);

                 [Bindable]private var dgArrcollection:ArrayCollection = new ArrayCollection();
                
                
                 private function onCreationComplete():void
                    {
                     dgArrcollection.addItem(mainArrcollection.getItemAt(comboBox.selectedIndex));
                    }
                    private function comboBoxChangeHandler(event:Event):void
                    {
                     var _selectedIndex:int = (event.currentTarget as ComboBox).selectedIndex
                     dgArrcollection.removeAll();
                     dgArrcollection.addItem(mainArrcollection.getItemAt(_selectedIndex));
                    }
                ]]>
              </mx:Script>
              <mx:ComboBox id="comboBox" labelField="name" dataProvider="{mainArrcollection}" change="comboBoxChangeHandler(event);"/>
              <mx:DataGrid id="dataGrid" dataProvider="{dgArrcollection}" x="10" y="177" visible="true">          
                <mx:columns>
                 <mx:DataGridColumn  headerText="Name" dataField="name"/>           
                 <mx:DataGridColumn dataField="rollno" headerText="Roll No" />           
                 <mx:DataGridColumn dataField="age" headerText="Age" />
                </mx:columns>
              </mx:DataGrid>
              </mx:Application>

               

               

              Thanks,

              Bhasker

              • 4. Re: How to filter Array collection
                vineet osho Level 1

                Thanks A lot bhasker for your support.you completely solved my problem.

                 

                 

                Regards

                Vineet osho

                • 5. Re: How to filter Array collection
                  BhaskerChari Level 4

                  Thanks Vineet keep the good work..Have a happy flex coding..