Question

我有一个DataGrid，其中一列有一个ComboBox作为其中一列的项目编辑器。 ComboBox＆＃39; 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]。

Answer 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>

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

Answer 2

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

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

然后，您应该在selectedItemId中将此新属性editorDataField设置为DataGridColumn。

Actionscript Datagrid ItemEditor具有与DataGridColumn值类型不同的类型

2 个答案: