我对上面链接的示例的区别在于我的显示值(用户看到的内容)与我想要选择并存储在我的数据提供程序中的id值不同.
所以我拥有的是:
<mx:DataGridColumn headerText="Type" width="200" datafield="TransactionTypeID" editordatafield="value" textAlign="center" editable="true" rendererIsEditor="true">
<mx:itemRenderer>
<mx:Component>
<mx:ComboBox dataProvider="{parentDocument.transactionTypesData}"/>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
其中transactionTypesData同时包含’data’和’label’字段(根据ComboBox的原因 – 为什么它不提供labelField和idField,我永远不会知道).
无论如何,上面的MXML代码不能以两种方式工作:
>组合框不会显示任何选定的项目.
>选择项目后,它不会将所选项目存储回数据存储区.
那么,有没有人有类似的情况工作?
解决方法
值得庆幸的是,我终于在Experts Exchange(hobbit72的答案)上找到了一些很好的帮助,描述了如何创建一个在网格中作为ItemRenderer工作的自定义组件.
我已经扩展了该代码,也支持使用组合框作为ItemEditor.完整组件如下:
<?xml version="1.0" encoding="utf-8"?>
<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>
使用此组件是直截了当的.作为ItemRenderer:
<mx:DataGridColumn headerText="Child" datafield="PersonID" editable="false" textAlign="center">
<mx:itemRenderer>
<mx:Component>
<fx:GridComboBox dataProvider="{parentDocument.childrenData}" labelField="Name" lookupField="PersonID" change="dispatchEvent(new mx.events.DataGridEvent(mx.events.DataGridEvent.ITEM_FOCUS_OUT,true,true))"/>
</mx:Component>
</mx:itemRenderer>
</mx:DataGridColumn>
使用此组件是直截了当的.作为ItemEditor:
<mx:DataGridColumn labelFunction="lookupChildName" headerText="Child" datafield="PersonID" editable="true" editordatafield="selectedItemKey">
<mx:itemEditor>
<mx:Component>
<fx:GridComboBox dataProvider="{parentDocument.childrenData}" labelField="Name" lookupField="PersonID" change="dispatchEvent(new mx.events.DataGridEvent(mx.events.DataGridEvent.ITEM_FOCUS_OUT,true))"/>
</mx:Component>
</mx:itemEditor>
</mx:DataGridColumn>
请注意,当将它用作ItemEditor时,必须使用自定义labelFunction(在我的情况下从PersonID中查找Name),否则只在字段未被编辑时才能看到网格中的键(不是问题)如果您的键/值相同).
请注意,就我而言,我希望项目聚焦事件能够传播以向用户提供即时反馈(我的DataGrid具有itemFocusOut =“handleChange()”),因此更改事件创建了ITEM_FOCUS_OUT事件.
请注意,当您不介意仅在用户单击要编辑的单元格时显示的ComboBox时,可能有更简单的方法将ComboBox作为ItemEditor.我想要的方法是在DataGrid中显示所有行的组合框,并且可编辑且具有良好的事件传播的通用方法.