I have a have a program like following:
[Bindable]
private var myDP:Array = [
{label: "1", selected: true},
{label: "2", selected: false}
];
</mx:Script>
<mx:DataGrid dataProvider="{myDP}">
<mx:columns>
<mx:DataGridColumn dataField="label" headerText="Label" />
<mx:DataGridColumn dataField="selected" itemRenderer="mx.controls.CheckBox" />
</mx:columns>
</mx:DataGrid>
It works fine, but when the the checkbox is changed, the value is not updated on the arraylist. Is there a way to trigger some function when the checkbox is changed on this item renderer?
On checkbox change event you can dispatch event like following:
<s:CheckBox change="onChange()" />
private function onChange():void
{
var testEvent:CustomEvent = new CustomEvent(CustomEvent.SELECT_ITEM_EVENT,true);
CustomEvent.selectedItem = data;
dispatchEvent(selectEvent);
}
And get/add EventListener that event in main page:
addEventListener(CustomEvent.SELECT_ITEM_EVENT, this.selectFunction);
private function selectFunction(item:CustomEvent):void
{
// Your Action
}
Hope it helps.
Your code need slight modification; replace below code line
<mx:DataGridColumn dataField="selected" itemRenderer="mx.controls.CheckBox" />
with
<mx:DataGridColumn dataField="selected" itemRenderer="itemRenderer.checkBoxRndr" />
and add an item-renderer component(say 'checkBoxRndr') in the project within a folder 'itemRenderer'.
And the item -renderer will be,
<?xml version="1.0" encoding="utf-8"?>
<mx:HBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="20" verticalAlign="middle"
verticalGap="0" horizontalGap="0" horizontalAlign="center" verticalScrollPolicy="off" horizontalScrollPolicy="off"
paddingBottom="0" paddingLeft="0" paddingRight="0" paddingTop="0">
<mx:Script>
<![CDATA[
override public function set data(value:Object):void{
if(value != null){
super.data = value;
if(data.hasOwnProperty("selected") && data.selected != null){
rndrCheckBox.selected = data.selected;
}
}
}
private function onChange():void{
data.selected = rndrCheckBox.selected;
}
]]>
</mx:Script>
<mx:CheckBox id="rndrCheckBox" change="{onChange()}"/>
</mx:HBox>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.