title: Flex CheckBox in Datagrid
body: <pre>
  In the followin flex Code : 
  Also viewable at : http://www.cse.epicenterlabs.com/checkBoxDg/checkBoxDg.html
  1. Add a row in datagrid by clicking on "AddRow"
  2. Click on "CheckDg" to see the values of all the checkboxes
       - it shows "checkBox57" or "checkBox64" or some similar string
  3. Now, "select" the checkBox in the first row.
  4. Click again on "CheckDg"
      -it show "true"
  
  So, initially dp.getItemAt(i).date returns a CheckBox
  and later it returns the "selected" value of the CheckBox?
  Why this difference?
  </pre>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" viewSourceURL="srcview/index.html"&gt;
          &lt;mx:Canvas&gt;
          &lt;mx:DataGrid x="69" y="119" id="dgFee" editable="true" dataProvider="{dp}"&gt;
              &lt;mx:columns&gt;
              &lt;mx:DataGridColumn headerText="Date" dataField="date" width="100" editable="true" 
              editorDataField="selected" rendererIsEditor="true"&gt;
              &lt;mx:itemRenderer&gt;
                  &lt;mx:Component&gt;
                      &lt;mx:CheckBox selected="false"&gt;
                                         &lt;/mx:CheckBox&gt;
                          &lt;/mx:Component&gt;
              &lt;/mx:itemRenderer&gt;
              &lt;/mx:DataGridColumn&gt;
                         &lt;mx:DataGridColumn dataField="amount" headerText="Amount" editable="true"&gt;
                           &lt;mx:itemEditor&gt;
                           &lt;mx:Component&gt;
                                    &lt;mx:TextInput restrict="0-9"/&gt;
                           &lt;/mx:Component&gt;
                           &lt;/mx:itemEditor&gt;   
                         &lt;/mx:DataGridColumn&gt;
              &lt;/mx:columns&gt;
          &lt;/mx:DataGrid&gt;
          &lt;mx:CheckBox x="130" y="54" label="Checkbox" selected="true" click="Alert.show(abc.selected.toString())" id="abc"/&gt;
  &lt;mx:Script&gt;
      &lt;![CDATA[
          import mx.controls.CheckBox;
          import mx.collections.ArrayCollection;
          import mx.controls.Alert;
          public var dp:ArrayCollection = new ArrayCollection();
          public function addRow():void
          {
            var tmp:Object = new Object();
            tmp['amount'] = 100;
            tmp['date'] = new CheckBox();
            dp.addItem(tmp);
          }
          public function delRow():void
          {
              if(dgFee.selectedIndex != -1)
              dp.removeItemAt(dgFee.selectedIndex);
          }
  
          public function loop1():void
          {
              for(var i:int=0;i&lt;dp.length;i++)
              {
                 Alert.show(dp.getItemAt(i).date);
              }
          }
      ]]&gt;
  &lt;/mx:Script&gt;
                  &lt;mx:Button x="29" y="89" label="AddRow" click="addRow()"/&gt;
                  &lt;mx:Button x="107" y="89" label="DelRow" click="delRow()"/&gt;
                  &lt;mx:Button x="184" y="89" label="CheckDg" click="loop1()"/&gt;
  
  &lt;/mx:Canvas&gt;    
  &lt;/mx:Application&gt;
  </code></pre>