Flex DataGrid DataChange Event not working - apache-flex

Question

In my code the datagrid is not fire datachanged event.
can anyone help me to find where I am wrong. for help the code is given below.
<mx:DataGrid id="userlist"
horizontalGridLines="true"
horizontalGridLineColor="0xeeeeee"
dataChange="dataChanged();"
editable="true"
change="changegrid(event);"
width="100%"
height="250" borderColor="#FF0000" borderStyle="solid"
borderThickness="1">
<mx:columns >
<mx:DataGridColumn dataField="User" editable="false" headerText="User" />
<mx:DataGridColumn dataField="cam" editable="true" width="24" itemEditor="mx.controls.CheckBox" editorDataField="cam" textAlign="center" headerText="M">
<mx:itemRenderer>
<mx:Component >
<mx:Box horizontalAlign="center" verticalAlign="middle" height="100%" width="100%">
<mx:CheckBox id="chb" click="data.cam=!data.cam" selected="{data.cam}"/>
</mx:Box>
</mx:Component>
</mx:itemRenderer>
<mx:headerRenderer>
<mx:Component>
<mx:Image width="16" height="16" toolTip="Change Cam Status" source="#Embed(source='icons/webcam_start.png')" verticalAlign="middle" horizontalAlign="center"/>
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="mic" editable="false" itemEditor="mx.controls.CheckBox" editorDataField="mic" width="24" textAlign="center" headerText="C">
<mx:itemRenderer>
<mx:Component >
<mx:Box horizontalAlign="center" verticalAlign="middle" height="100%" width="100%">
<mx:CheckBox id="chb1" click="data.mic=!data.mic" selected="{data.mic}" />
</mx:Box>
</mx:Component>
</mx:itemRenderer>
<mx:headerRenderer>
<mx:Component>
<mx:Image width="16" height="16" toolTip="Change Microphone Status " source="#Embed(source='icons/microphone_plus.png')" verticalAlign="middle" horizontalAlign="center"/>
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn dataField="sound" editable="false" itemEditor="mx.controls.CheckBox" editorDataField="sound" width="24" textAlign="center" headerText="R1">
<mx:itemRenderer>
<mx:Component >
<mx:Box horizontalAlign="center" verticalAlign="middle" height="100%" width="100%">
<mx:CheckBox id="chb2" click="data.sound=!data.sound" selected="{data.sound}"/>
</mx:Box>
</mx:Component>
</mx:itemRenderer>
<mx:headerRenderer>
<mx:Component>
<mx:Image width="16" height="16"
toolTip="Turn Sound on/off " source="#Embed(source='icons/audio_volume_high.png')" verticalAlign="middle" horizontalAlign="center"/>
</mx:Component>
</mx:headerRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
I am using the following data
private var plist:ArrayList = new ArrayList(
[{User:'Ravi Kanchan Sharma', cam:true, mic:true, sound:true},
{User:'Vijay Anand Sharma', cam:true, mic:false, sound:true},
{User:'Yogender Kumar Sharma', cam:false, mic:true, sound:true}]);`

Answer 1

For the dataChange event to fire from a component, the 'data' value needs to change. It is not clear from your code why the DataGrid's data value will change.
the dataChange event is usually used inside an itemRenderer to modify its display contents whenever the itemRenderer's data property is changed. The data property in an itemRenderer would represent a single element of the DataGrid's dataProvider.
Unless you are using the DataGrid as an itemRenderer--which is possible but unusual--I would not expect the DataGrid's data property to change; and therefore the dataChange event will never fire from the DataGrid.