5 Replies Latest reply: Jan 30, 2013 9:12 AM by Flex harUI RSS

    In DataGrid, how do I count the number of selected CheckBox?

    lee704 Community Member

      I am using a CheckBox as an itemRenderer in a DataGrid but am not certain how I can count the number of items selected.  Below is my sample code.

       

      <?xml version="1.0"?>

      <!-- dpcontrols/DataGridPassData.mxml -->

      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

                                              initialize="initData()">

                <mx:Script>

                          <![CDATA[

                                    import mx.collections.*;

                                    import mx.events.ListEvent;

       

                                    [Bindable]

                                    public var dpTests:ArrayCollection;

       

                                    [Bindable]

                                    private var vCountSelected:int=0;

       

                                    private var DGArray:Array = [

                                              {Category:'Transfer', Status:'Active', Price:10.55},

                                              {Category:'Transfer', Status:'Inactive', Price:0},

                                              {Category:'Transfer', Status:'Archived', Price:0},

                                              {Category:'Initial', Status:'New', Price:25.75},

                                              {Category:'Initial', Status:'Old', Price:15.25}];

       

       

                                    //Initialize dpTests ArrayCollection variable from the Array.

                                    public function initData():void {

                                              dpTests=new ArrayCollection(DGArray);

                                    }

       

                                    protected function dgTests_changeHandler(event:ListEvent):void

                                    {

                                              var count:int=0;

       

                                              // loop through the  datagrid

                                              for (var s:int=0; s < dgTests.dataProvider.length; s++)

                                              {

                                                        // Select a row during each loop

                                                        this.dgTests.selectedIndex=s;

       

                                                        //var c:int=dgTests.selectedItem.dfSelected;

                                                        var b:Boolean=dgTests.selectedItem.dfSelected;

       

                                                        if (b=true)

                                                        {

                                                                  // increment the variable

                                                                  count++;

                                                        }

                                              }

                                              // assign the local variable to the private variable

                                              vCountSelected=count;

                                    }

       

                                    private function itemClickEvent(event:ListEvent):void {

                                              clickColumn.text=String(event.columnIndex);

                                              clickRow.text=String(event.rowIndex);

                                              eventType.text=event.type;

                                    }

                          ]]>

                </mx:Script>

       

                <mx:DataGrid id="dgTests" width="350" height="200" change="dgTests_changeHandler(event)"

                                               dataProvider="{dpTests}" itemClick="itemClickEvent(event)">

                          <mx:columns>

                                    <mx:DataGridColumn dataField="Category" />

                                    <mx:DataGridColumn dataField="Status" />

                                    <mx:DataGridColumn dataField="Price" />

                                    <mx:DataGridColumn id="dgcCategorySelected"

                                                                               dataField="dfSelected"

                                                                               itemRenderer="mx.controls.CheckBox"

                                                                               rendererIsEditor="true"

                                                                               editorDataField="selected"

                                                                               width="20"

                                                                               headerText=""

                                                                               textAlign="center"/>

                          </mx:columns>

                </mx:DataGrid>

       

                <mx:Form id="fSumm">

                          <mx:FormItem label="Column Index:">

                                    <mx:Label id="clickColumn"/>               

                          </mx:FormItem>

                          <mx:FormItem label="Row Index:">

                                    <mx:Label id="clickRow"/>              

                          </mx:FormItem>

                          <mx:FormItem label="Type:">

                                    <mx:Label id="eventType"/>             

                          </mx:FormItem>

                          <mx:FormItem label="Count Selected:">

                                    <mx:Label id="lCountSelected" text="{this.vCountSelected}"/>             

                          </mx:FormItem>

                </mx:Form>

      </mx:Application>

       

      My assumption (which is obviously wrong) is that the value for count should increment and decrement as items are checked and unchecked.  Instead, when I check the first checkbox I get the total of items in the dataprovider.

       

      How can I just get the count of the items selected with the checkbox?

       

      Thanks!

      Lee

        • 1. Re: In DataGrid, how do I count the number of selected CheckBox?
          Flex harUI Adobe Employee

          Not sure, but your code looks like

              if (b = true)

           

          and maybe should be

           

              if (b == true)

           

          or just

           

              if (b)

          • 2. Re: In DataGrid, how do I count the number of selected CheckBox?
            lee704 Community Member

            I agree, "if (b == true)" or "if(b)" should work.  Interestingly, it does not.  I assume it has something to do with the itemRenderer but for the life of me cannot figure out how to fix this.  Any help would be greatly apprciated.

             

            Lee

            • 3. Re: In DataGrid, how do I count the number of selected CheckBox?
              Flex harUI Adobe Employee

              What does your code look like now?

              • 4. Re: In DataGrid, how do I count the number of selected CheckBox?
                lee704 Community Member

                <?xml version="1.0"?>

                <!-- dpcontrols/DataGridPassData.mxml -->

                <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

                                                        initialize="initData()">

                          <mx:Script>

                                    <![CDATA[

                                              import mx.collections.*;

                                              import mx.events.ListEvent;

                 

                                              [Bindable]

                                              public var dpTests:ArrayCollection;

                 

                                              [Bindable]

                                              private var vCountSelected:int=0;

                 

                                              private var DGArray:Array = [

                                                        {Category:'Transfer', Status:'Active', Price:10.55},

                                                        {Category:'Transfer', Status:'Inactive', Price:0},

                                                        {Category:'Transfer', Status:'Archived', Price:0},

                                                        {Category:'Initial', Status:'New', Price:25.75},

                                                        {Category:'Initial', Status:'Old', Price:15.25}];

                 

                 

                                              //Initialize dpTests ArrayCollection variable from the Array.

                                              public function initData():void {

                                                        dpTests=new ArrayCollection(DGArray);

                                              }

                 

                                              protected function dgTests_changeHandler(event:ListEvent):void

                                              {

                                                        var count:int=0;

                 

                                                        // loop through the  datagrid

                                                        for (var s:int=0; s < dgTests.dataProvider.length; s++)

                                                        {

                                                                  // Select a row during each loop

                                                                  this.dgTests.selectedIndex=s;

                 

                                                                  //var c:int=dgTests.selectedItem.dfSelected;

                                                                  var b:Boolean=dgTests.selectedItem.dfSelected;

                 

                                                                  if (b == true)

                                                                  {

                                                                            // increment the variable

                                                                            count++;

                                                                  }

                                                        }

                                                        // assign the local variable to the private variable

                                                        vCountSelected=count;

                                              }

                 

                                              private function itemClickEvent(event:ListEvent):void {

                                                        clickColumn.text=String(event.columnIndex);

                                                        clickRow.text=String(event.rowIndex);

                                                        eventType.text=event.type;

                 

                                                        //vCountSelected++;

                                              }

                                    ]]>

                          </mx:Script>

                 

                          <mx:DataGrid id="dgTests" width="350" height="200" change="dgTests_changeHandler(event)"

                                                         dataProvider="{dpTests}" itemClick="itemClickEvent(event)">

                                    <mx:columns>

                                              <mx:DataGridColumn dataField="Category" />

                                              <mx:DataGridColumn dataField="Status" />

                                              <mx:DataGridColumn dataField="Price" />

                                              <mx:DataGridColumn id="dgcCategorySelected"

                                                                                         dataField="dfSelected"

                                                                                         itemRenderer="mx.controls.CheckBox"

                                                                                         rendererIsEditor="true"

                                                                                         editorDataField="selected"

                                                                                         width="20"

                                                                                         headerText=""

                                                                                         textAlign="center"/>

                                    </mx:columns>

                          </mx:DataGrid>

                 

                          <mx:Form id="fSumm">

                                    <mx:FormItem label="Column Index:">

                                              <mx:Label id="clickColumn"/>               

                                    </mx:FormItem>

                                    <mx:FormItem label="Row Index:">

                                              <mx:Label id="clickRow"/>              

                                    </mx:FormItem>

                                    <mx:FormItem label="Type:">

                                              <mx:Label id="eventType"/>             

                                    </mx:FormItem>

                                    <mx:FormItem label="Count Selected:">

                                              <mx:Label id="lCountSelected" text="{this.vCountSelected}"/>             

                                    </mx:FormItem>

                          </mx:Form>

                </mx:Application>

                • 5. Re: In DataGrid, how do I count the number of selected CheckBox?
                  Flex harUI Adobe Employee

                  Try initializing that field to false in each array item.

                  ,

                   

                  If that doesn’t work, try an actual class definition instead of plain objects.  The DG is trying to guess the datatype of the dfSelected field in order to know how to save the value.  If it guesses wrong, the way booleans get handled could cause them to appear as if they are true.