I have a mx DataGrid with 2 column. The first column has its data rendered in a TextInput and the second column renderer in a ComboBox. When I change the selected value in the ComboBox, I want the TextInput of the same index to have its text changed to the value selected in the ComboBox. Can anyone help me with this? My code is below.
<mx:DataGrid id="myGrid" rowHeight="25" dataProvider="{Testarray}" width="100%" height="205" chromeColor="#D0CCAF" headerHeight="0" showHeaders="false" >
<mx:columns>
<mx:DataGridColumn headerText="My Header 1"
editable="true"
dataField="LBL"
>
<mx:itemRenderer>
<fx:Component>
<mx:HBox horizontalAlign="left" horizontalScrollPolicy="off" verticalScrollPolicy="off">
<s:TextInput id="label_txt" text="{data.LBL}" width="98%"/>
</mx:HBox>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
<mx:DataGridColumn headerText="My Header 2"
editable="true"
rendererIsEditor="true"
dataField="ALIAS"
>
<mx:itemRenderer>
<fx:Component>
<renderers:comboItemRenderer height="80%" change="comboitemrenderer1_changeHandler(event)" lookupField="ALIAS" labelField="ALIAS" dataProvider="{outerDocument.searchCustomizationComponents_array}">
<fx:Script>
<![CDATA[
import mx.events.DataGridEvent;
import mx.events.ListEvent;
protected function comboitemrenderer1_changeHandler(event:ListEvent):void
{
//WHAT TO PUT HERE?
}
]]>
</fx:Script>
</renderers:comboItemRenderer>
</fx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
</mx:columns>
</mx:DataGrid>
I got it myself. Thanks buddies.
I needed to add these 2 lines of codes for the textInput to take the value of the selectedItem int he ComboBox.
protected function comboitemrenderer1_changeHandler(event:ListEvent):void
{
outerDocument.myGrid.dataProvider[outerDocument.myGrid.selectedIndex]['LBL'] = this.selectedItemKey;
outerDocument.myGrid.invalidateList();
}
Also note that the code for my comboitemrenderer below:
<mx:ComboBox
xmlns:mx="http://www.adobe.com/2006/mxml"
dataChange="setSelected()"
change="onSelectionChange(event)"
focusEnabled="true">
<mx:Script>
<![CDATA[
import mx.events.DataGridEvent;
import mx.events.ListEvent;
import mx.controls.dataGridClasses.DataGridListData;
private var _ownerData:Object;
private var _lookupField:String = "value";
// When using this component as an itemEditor rather than an itemRenderer
// then set ' editorDataField="selectedItemKey"' on the column to
// ensure that changes to the ComboBox are propogated.
[Bindable] public var selectedItemKey:Object;
public function set lookupField (value:String) : void {
if(value) {
_lookupField = value;
setSelected();
}
}
override public function set data (value:Object) : void {
if(value) {
_ownerData = value;
setSelected();
}
}
override public function get data() : Object {
return _ownerData;
}
private function setSelected() : void {
if (dataProvider && _ownerData) {
var col:DataGridListData = DataGridListData(listData);
for each (var dp:Object in dataProvider) {
if (dp[_lookupField] == _ownerData[col.dataField]) {
selectedItem = dp;
selectedItemKey = _ownerData[col.dataField];
return;
}
}
}
selectedItem = null;
}
private function onSelectionChange (e:ListEvent) : void {
if (selectedItem && _ownerData) {
var col:DataGridListData = DataGridListData(listData);
_ownerData[col.dataField] = selectedItem[_lookupField];
selectedItemKey = selectedItem[_lookupField];
}
}
]]>
</mx:Script>
</mx:ComboBox>