我如何知道何时单击了 Flex DataGrid itemRenderer 中的按钮? [英] How can I know when a Button in a Flex DataGrid itemRenderer is clicked?

问题描述

我有一个显示几列数据的 DataGrid 组件.它有一个额外的列，显示一个按钮，允许用户对记录采取行动.

I have a DataGrid component that displays a few columns of data. It has one additional column that displays a Button that allows the user to take an action with regard to the record.

<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 中的数据无关的其他数据.

I need to perform an action in the parent component, using other data that is available there, but unrelated to the data in the DataGrid.

在父组件中捕捉Button点击的最好方法是什么，并知道它对应的记录是什么?

What is the best way to catch the Button click in the parent component, and know what record it corresponds to?

我应该完全使用自定义事件、itemEditor 或其他东西吗?

Should I use a Custom Event, or an itemEditor, or something else completely?

推荐答案

感谢 Joel.这是我在阅读那篇文章(我之前读过)后想到的最终解决方案.我想将其 Button 被单击的项目添加到一个数组，该数组是另一个项目的属性，因此我将其他项目"作为属性传递到 DataGrid 组件中，并在来自 itemRenderer 的函数调用中对其执行操作:

Thanks Joel. Here's the final solution I came up with after reading that article (which I've read before). I want to add the item whose Button was clicked to an Array which is a property of another item, so I pass the "other item" into the DataGrid Component as a property, and perform actions against it in the function call from the 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);
        }
    }
}

这篇关于我如何知道何时单击了 Flex DataGrid itemRenderer 中的按钮?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！