数据网格编辑后的 ​​Flex 更新数据提供者

Flex update dataprovider after datagrid edited

我有一个 datagrid 的 flex 和一个 itemrenderer 和一个 dataprovider

问题是当我编辑 datagrid 时,提供程序不会更新编辑后的值。

这是我的datagrid

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" borderColor="#FFFFFF" cornerRadius="0">
        <mx:Script>
            <![CDATA[
                import mx.core.Application;
                [Bindable]
                private var provider:ArrayCollection = new ArrayCollection([
                {data:'1'},
                {data:'2"}]);
            ]]>
        </mx:Script>

<!-- Here is the data grid , the provider is groupeCollection, ihave set editable to true-->
            <mx:DataGrid id="myGrid" width="100%" height="80%" 
                dataProvider="{provider}" x="0" editable="true" >
                <mx:columns>
                    <mx:DataGridColumn dataField="data" >
                        <mx:itemRenderer>
                            <mx:Component>
                                <mx:NumericStepper minimum="1" maximum="10000" />
                            </mx:Component>
                        </mx:itemRenderer>
                    </mx:DataGridColumn>
                </mx:columns> 
            </mx:DataGrid>
    </mx:Canvas>

现在,在编辑单元格 (dataFiel="data") 并打印 dataprovider 后,其中没有任何变化。

您可以使用 itemEditor 而不是 itemRenderer,如果您想在运行时编辑数据,itemRenderer 只会显示您的值,我们已使用

手动设置值

data.propertyname = 值;

试试这个代码:

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" borderColor="#FFFFFF" cornerRadius="0">
    <mx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.core.Application;
            [Bindable]
            private var provider:ArrayCollection = new ArrayCollection([
                {data:'1'},
                {data:'2'}]);
        ]]>
    </mx:Script>
    <mx:VBox>
        <!-- Here is the data grid , the provider is groupeCollection, ihave set editable to true-->
        <mx:DataGrid id="myGrid" width="100%" height="80%" 
                     dataProvider="{provider}" x="0" editable="true" >
            <mx:columns>
                <mx:DataGridColumn dataField="data" editorDataField="value">
                    <mx:itemEditor>
                        <mx:Component>
                            <mx:NumericStepper minimum="1" maximum="10000" />
                        </mx:Component>
                    </mx:itemEditor>
                </mx:DataGridColumn>
            </mx:columns> 
        </mx:DataGrid>

        <mx:DataGrid  width="100%" height="80%" 
                     dataProvider="{provider}" x="0" editable="true" >
            <mx:columns>
                <mx:DataGridColumn dataField="data" >
                    <mx:itemRenderer>
                        <mx:Component>
                            <mx:NumericStepper minimum="1" maximum="10000" />
                        </mx:Component>
                    </mx:itemRenderer>
                </mx:DataGridColumn>
            </mx:columns> 
        </mx:DataGrid>
    </mx:VBox>
</mx:Canvas>

好久没用过Flex 3了,能不能看看ItemRenderer是否支持boolean属性rendererIsEditor?如果是,则将其设置为 true 那么您的渲染器也将用作编辑器。

编辑:我现在尝试了您的代码,ArrayCollection 中的项目声明似乎存在一些编译器错误。您似乎将 "' 混合用于项目。我更正了它,现在在下面的例子中验证了它有效。您可以单击该按钮来检查场景前后。为了您的方便,我粘贴了完整的代码,只需粘贴 运行:

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" minWidth="955" minHeight="600">

    <mx:Script>
        <![CDATA[
            import mx.controls.Alert;
            protected function button1_clickHandler(event:MouseEvent):void
            {
                for(var i:int = 0; i<provider.length; i++) {
                    Alert.show(provider.getItemAt(i).data); 
                }
            }
        ]]>
    </mx:Script>
    <mx:VBox width="100%" height="100%">
        <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="100%" height="100%" borderColor="#FFFFFF" cornerRadius="0">
            <mx:Script>
                <![CDATA[
                    import mx.collections.ArrayCollection;
                    import mx.core.Application;
                    [Bindable]
                    private var provider:ArrayCollection = new ArrayCollection([
                        {data:'1'},
                        {data:'2'}]);

                ]]>
            </mx:Script>

            <!-- Here is the data grid , the provider is groupeCollection, ihave set editable to true-->
            <mx:DataGrid id="myGrid" width="100%" height="80%" 
                         dataProvider="{provider}" x="0" editable="true" >
                <mx:columns>
                    <mx:DataGridColumn dataField="data" >
                        <mx:itemRenderer>
                            <mx:Component>
                                <mx:NumericStepper minimum="1" maximum="10000" />
                            </mx:Component>
                        </mx:itemRenderer>
                    </mx:DataGridColumn>
                </mx:columns> 
            </mx:DataGrid>
        </mx:Canvas>
        <mx:Button label="Check DP" click="button1_clickHandler(event)"/>
    </mx:VBox>
</mx:Application>