4

我有一个显示几列数据的 DataGrid 组件。它有一个额外的列，显示一个按钮，允许用户对记录执行操作。

<mx:DataGrid dataProvider="{myData}">
    <mx:columns>
        <mx:DataGridColumn dataField="firstName" headerText="First Name" 
            width="75" />

        <mx:DataGridColumn dataField="LastName" headerText=" Last Name" 
            width="150" />

        <mx:DataGridColumn dataField="phone" headerText="Phone" 
            width="120" />

        <mx:DataGridColumn headerText="" width="110">
            <mx:itemRenderer>
                <mx:Component>
                    <mx:Box horizontalAlign="center" width="100%">
                        <mx:Button label="Take Action" />
                    </mx:Box>
                </mx:Component>
            </mx:itemRenderer>
        </mx:DataGridColumn>
    </mx:columns>
</mx:DataGrid>

我需要在父组件中执行一个操作，使用那里可用但与 DataGrid 中的数据无关的其他数据。

在父组件中捕获 Button 单击并知道它对应的记录的最佳方法是什么？

我应该完全使用自定义事件、itemEditor 还是其他东西？

4

2 回答 2

2

您需要将 itemRenderer 设为一个类，然后使用此处描述的方法从该类中引用您的 DataGrid 。然后，您可以从 DataGrid 调度事件，这些事件很容易在包含它的容器中侦听。您不想做的是依赖冒泡或尝试直接收听 itemRenderer。您可能希望创建一个带有 DataGrid 行的数据属性的自定义事件，以便您的事件侦听器可以快速访问此信息。

于 2009-07-08T17:04:35.100 回答
1

谢谢乔尔。这是我在阅读那篇文章（我之前读过）后提出的最终解决方案。我想将单击其 Button 的项目添加到作为另一个项目属性的数组中，因此我将“其他项目”作为属性传递给 DataGrid 组件，并在 itemRenderer 的函数调用中对其执行操作：

/* CustomDataGrid.mxml */
<mx:DataGrid xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
            public var otherData:Object;

            public function takeAction(item:Object):void
            {
                otherData["children"][0] = item;
            }
        ]]>
    </mx:Script>

    <mx:columns>
        <mx:DataGridColumn dataField="firstName" headerText="First Name" 
            width="75" />

        <mx:DataGridColumn dataField="LastName" headerText=" Last Name" 
            width="150" />

        <mx:DataGridColumn dataField="phone" headerText="Phone" 
            width="120" />

        <mx:DataGridColumn headerText="" width="110" 
            itemRender="ActionButtonItemRenderer" />
    </mx:columns>
</mx:DataGrid>

/* ActionButtonItemRenderer.as */
package
{
    import flash.events.MouseEvent;

    import mx.controls.Button;

    public class ActionButtonItemRenderer extends Button
    {
        public function ActionButtonItemRenderer()
        {
            super();

            label = "Take Action";
        }

        override protected function clickHandler(event:MouseEvent):void
        {
            super.clickHandler(event);

            var owner:CustomDataGrid = listData.owner as CustomDataGrid;

            owner.takeAction(data);
        }
    }
}
于 2009-07-08T17:56:47.477 回答