2009-07-08 5 views
4

Ich habe eine DataGrid-Komponente, die einige Datenspalten anzeigt. Es hat eine zusätzliche Spalte, die einen Button anzeigt, der es dem Benutzer ermöglicht, eine Aktion in Bezug auf den Datensatz durchzuführen.Wie kann ich wissen, wann auf einen Button in einem Flex DataGrid itemRenderer geklickt wird?

<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> 

Ich brauche eine Aktion in der übergeordneten Komponente durchzuführen, unter Verwendung andere Daten, die dort zur Verfügung steht, aber in keinen Zusammenhang mit den Daten in dem Datenraster.

Was ist der beste Weg, um die Schaltfläche klicken Sie in der übergeordneten Komponente zu fangen, und wissen, welcher Datensatz es entspricht?

Sollte ich ein benutzerdefiniertes Ereignis oder einen itemEditor oder etwas anderes vollständig verwenden?

Antwort

1

Danke Joel. Hier ist die endgültige Lösung, die ich nach dem Lesen dieses Artikels (was ich vorher gelesen habe) gefunden habe. Ich möchte das Element hinzufügen, dessen Schaltfläche auf ein Array geklickt wurde, das eine Eigenschaft eines anderen Elements ist. Daher übergebe ich das "andere Element" als Eigenschaft an die DataGrid-Komponente und führe im Funktionsaufruf von itemRenderer Aktionen dagegen aus:

/* 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

Sie müssen den itemRenderer zu einer Klasse machen und dann innerhalb dieser Klasse auf Ihr DataGrid verweisen, indem Sie the methods described here verwenden. Sie können dann Ereignisse aus dem DataGrid versenden, die in dem Container, der sie enthält, leicht zu überwachen sind. Was Sie nicht tun möchten, ist auf Blasen oder versuchen, den itemRenderer direkt zu hören. Wahrscheinlich möchten Sie ein benutzerdefiniertes Ereignis erstellen, das die Dateneigenschaft der DataGrid-Zeile enthält, damit Ihr Ereignis-Listener schnell auf diese Informationen zugreifen kann.