Question

我正在尝试在DataGrid表中添加DropDownList。用户从下拉列表中选择其中一个项目后，我选择的项目不会被反映或未被选中。我知道我可以使用ComboBoxGridItemEditor来实现我要求的结果。但组合框是可编辑的，我不希望用户编辑，只是从列表中的一个选项中选择。这是我尝试在dataGrid中添加dropDownList的原因。

请问您能告诉我下拉列表中所选项目如何识别并更新dataGrid中单元格的值并将值保存回数据提供者吗？

问题：所以当我尝试选择蓝色时，单元格不会更新，而是保持红色。

感谢Rekha。

 <fx:Script>
    <![CDATA[                
        import mx.collections.ArrayCollection;      
        [Bindable]
        private var myDP:ArrayCollection = new ArrayCollection([
            {label1:"Order #2314", quant:3, color:'red'},
            {label1:"Order #2315", quant:3, color:'red'}     
        ]); 


    ]]>
</fx:Script>

<s:DataGrid id="myDG" x="85" y="57" width="393" height="151" dataProvider="{myDP}"
            editable="true" variableRowHeight="true">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="label1" headerText="Order #" editable="false"/>                
            <s:GridColumn dataField="quant" headerText="Qty" editable="true"/>

            <s:GridColumn dataField="color" headerText="Color" editable="true">                     
                <s:itemEditor>
                    <fx:Component>                              
                        <s:GridItemEditor>                          
                            <s:DropDownList id="myDropList" requireSelection="true">
                                <s:dataProvider>
                                    <s:ArrayCollection>
                                        <fx:String>red</fx:String>
                                        <fx:String>blue</fx:String>
                                        <fx:String>green</fx:String>
                                    </s:ArrayCollection>                                        
                                </s:dataProvider>
                            </s:DropDownList>                               
                        </s:GridItemEditor>                         
                    </fx:Component>
                </s:itemEditor>                 
            </s:GridColumn> 

        </s:ArrayList> 
    </s:columns >
</s:DataGrid>

Answer 1

基本上你需要从自定义itemrenderer中通过data getter/setter method更新/保存更改的selectedItem到arraycollection。

查看data[column.dataField] = value;此行保存到arraycollection。

<s:GridColumn dataField="color" headerText="Color" editable="true">                     
    <s:itemEditor>
        <fx:Component>                              
            <s:GridItemEditor>              
            <fx:Script>
                <![CDATA[

                    import mx.core.FlexGlobals;
                    import mx.events.FlexEvent;

                    import spark.events.IndexChangeEvent;

                    override public function set value(newValue:Object):void {

                        cb.selectedItem = newValue;
                    }

                    override public function get value():Object {
                        return cb.selectedItem.toString();
                    }

                    override public function setFocus():void {
                        cb.setFocus();
                    }

                    override public function save():Boolean
                    {
                        data[column.dataField] = value;                                     
                        return true;
                    }
                ]]>
            </fx:Script>
            <s:DropDownList id="cb" requireSelection="true">
                <s:dataProvider>
                    <s:ArrayCollection>
                        <fx:String>red</fx:String>
                        <fx:String>blue</fx:String>
                        <fx:String>green</fx:String>
                    </s:ArrayCollection>                                        
                </s:dataProvider>
            </s:DropDownList>                               
        </s:GridItemEditor>                         
    </fx:Component>
</s:itemEditor>

如何在Flex DataGrid中添加DropDown列表

1 个答案: