Reputation: 5
I have 3 columns in advanced data grid, First contains checkbox and other two contains text boxes,all of these are inside separate itemrenderers of datagrid columns
If checkbox is checked subsequent textboxes in particular row should be editable and when checkbox is unchecked textboxes should not be editable
Upvotes: -1
Views: 534
Reputation: 183
This Code will work
<?xml version="1.0" encoding="utf-8"?>
<s:WindowedApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
width="100%" height="100%" creationComplete="maximize()">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
import mx.collections.ArrayCollection;
[Bindable]
public var arrayColl:ArrayCollection = new ArrayCollection([
{sno:1, fname: 'ABC 1', lname: 'DEF 1'},
{sno:2, fname: 'ABC 2', lname: 'DEF 2'},
{sno:3, fname: 'ABC 3', lname: 'DEF 3'},
{sno:4, fname: 'ABC 4', lname: 'DEF 4'}
]);
]]>
</fx:Script>
<s:VGroup width="100%" height="100%" verticalAlign="middle" horizontalAlign="center">
<mx:AdvancedDataGrid id="advancedDataGrid" width="50%" height="50%" dataProvider="{arrayColl}">
<mx:columns>
<mx:AdvancedDataGridColumn dataField="" headerText="" width="50">
<mx:itemRenderer>
<fx:Component>
<s:MXAdvancedDataGridItemRenderer>
<fx:Script>
<![CDATA[
protected function chkEdit_changeHandler(event:Event):void
{
data.isEditable = chkEdit.selected;
outerDocument.arrayColl.refresh();
}
]]>
</fx:Script>
<s:CheckBox id="chkEdit" selected="false" change="chkEdit_changeHandler(event)"
verticalCenter="0" horizontalCenter="0"/>
</s:MXAdvancedDataGridItemRenderer>
</fx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn dataField="fname" headerText="First Name">
<mx:itemRenderer>
<fx:Component>
<s:MXAdvancedDataGridItemRenderer>
<fx:Script>
<![CDATA[
import spark.events.TextOperationEvent;
override public function set data(value:Object):void {
super.data = value;
if (data != null) {
txtFName.editable = data.isEditable;
}
}
protected function txtFName_changeHandler(event:TextOperationEvent):void
{
data.fname = event.currentTarget.text;
}
]]>
</fx:Script>
<s:TextInput id="txtFName" text="{listData.label}" editable="false" verticalCenter="0" horizontalCenter="0"
change="txtFName_changeHandler(event)"/>
</s:MXAdvancedDataGridItemRenderer>
</fx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
<mx:AdvancedDataGridColumn dataField="lname" headerText="Last Name">
<mx:itemRenderer>
<fx:Component>
<s:MXAdvancedDataGridItemRenderer>
<fx:Script>
<![CDATA[
import spark.events.TextOperationEvent;
override public function set data(value:Object):void {
super.data = value;
if (data != null) {
txtLName.editable = data.isEditable;
}
}
protected function txtLName_changeHandler(event:TextOperationEvent):void
{
data.lname = event.currentTarget.text;
}
]]>
</fx:Script>
<s:TextInput id="txtLName" text="{listData.label}" editable="false" verticalCenter="0" horizontalCenter="0"
change="txtLName_changeHandler(event)"/>
</s:MXAdvancedDataGridItemRenderer>
</fx:Component>
</mx:itemRenderer>
</mx:AdvancedDataGridColumn>
</mx:columns>
</mx:AdvancedDataGrid>
</s:VGroup>
</s:WindowedApplication>
Upvotes: 0