Actionscript Datagrid ItemEditor 的类型与 DataGridColumn 值的类型不同答案

【问题标题】：Actionscript Datagrid ItemEditor with different types than type of DataGridColumn valueActionscript Datagrid ItemEditor 的类型与 DataGridColumn 值的类型不同
【发布时间】：2014-10-01 08:20:20
【问题描述】：

我有一个 DataGrid，其中一列有一个 ComboBox 作为其中一列的项目编辑器。 ComboBox 的dataProvider 中的值类型与存储在正在编辑的单元格中的值类型不同。如何将项目编辑器返回的值映射到单元格中的值。一个完整的例子来说明我的问题：

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
               xmlns:s="library://ns.adobe.com/flex/spark" 
               xmlns:mx="library://ns.adobe.com/flex/mx"
               creationComplete="init()">

    <fx:Script>
        <![CDATA[
        import mx.collections.ArrayCollection;

        [Bindable]
        private var items:ArrayCollection;

        [Bindable]
        public var foobar:ArrayCollection;

        private function init():void
        {
            items = new ArrayCollection();
            items.addItem({name : "Adam", abbrev: "ABCD"});
            items.addItem({name : "Frank", abbrev : "EFGH"});
            items.addItem({name:"Bob", abbrev:"ABCD"});

            foobar = new ArrayCollection();
            foobar.addItem({id:"ABCD", displayValue:"Adam Buys Cheap Drinks"});
            foobar.addItem({id:"EFGH", displayValue:"Eban Flies Great Heat"});
        }
        ]]>
    </fx:Script>
    <mx:DataGrid dataProvider="{items}" editable="true">
        <mx:columns>
            <mx:DataGridColumn headerText="Name" dataField="name" />
            <mx:DataGridColumn headerText="Abbrev" dataField="abbrev"
                               editorDataField="selectedItem">
                <mx:itemEditor>
                    <fx:Component>
                        <mx:ComboBox labelField="displayValue"
                                     dataProvider="{outerDocument.foobar}" />
                    </fx:Component>
                </mx:itemEditor>
            </mx:DataGridColumn>
        </mx:columns>
    </mx:DataGrid>
</s:Application>

我希望看到的是，当用户从ComboBox 中选择一个项目时，返回值的id 属性被放置在网格中正在编辑的单元格中。

目前，id/displayValue 对象被传递，导致 [object object] 被显示。

【问题讨论】：

标签： actionscript-3 apache-flex datagrid combobox

【解决方案1】：

在您的情况下，将editorDataField="selectedItem" 更改为editorDataField="selectedLabel" 就足够了。如果你想拥有比下一步更复杂的 itemEditor（例如，自动添加一些文本）：

        <mx:DataGridColumn headerText="Abbrev" dataField="abbrev">
            <mx:itemEditor>
                <fx:Component>
                    <mx:ComboBox labelField="displayValue"
                                 dataProvider="{outerDocument.foobar}">
                        <fx:Script>
                            <![CDATA[
                            override public function get value():Object
                            {
                                return selectedLabel + "some example text";
                            }
                            ]]>
                        </fx:Script>
                    </mx:ComboBox>
                </fx:Component>
            </mx:itemEditor>
        </mx:DataGridColumn>

最后一个 - good article 关于 itemEditors（大部分是我带到那里的）。在 get value 方法中，您可以返回任何内容，这将显示在 DataGrid 上。

【讨论】：

【解决方案2】：

您需要基于ComboBox 类创建自己的项目编辑器并实现将返回所选项目ID 的属性。像这样的：

public function get selectedItemId():String {
    if (selectedItem) {
         return selectedItem.id;
    } else {
         return null;
    }
}

那么您应该在DataGridColumn 中将这个新属性selectedItemId 设置为editorDataField。

【讨论】：