2009-07-08 98 views
4

我有一个DataGrid组件显示几列数据。它有一个额外的列,显示一个按钮,允许用户对记录采取行动。如何知道Flex DataGrid itemRenderer中的按钮何时被点击?

<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中的数据无关。

什么是捕获父组件中的按钮点击的最佳方式,并知道它对应的记录是什么?

我应该使用自定义事件,还是itemEditor或其他东西?

回答

1

谢谢乔尔。这是我在阅读那篇文章后得出的最终解决方案(我之前读过)。我想将其按钮被单击的项目添加到另一个项目的属性数组中,因此我将“其他项目”作为属性传递给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); 
     } 
    } 
} 
2

您需要让itemRenderer成为一个类,然后使用the methods described here从该类内引用您的DataGrid。然后,您可以从DataGrid派发事件,这些事件很容易在容纳它的容器中侦听。你不想做的就是依靠冒泡或试图直接收听itemRenderer。您可能需要创建一个自定义事件,该事件包含DataGrid行的data属性,以便您的事件侦听器可以快速访问此信息。

相关问题