Как узнать, когда нажата кнопка в элементе данных DataGrid Flex?

Question

У меня есть компонент 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.

Каков наилучший способ поймать кнопку в родительском компоненте и узнать, к какой записи она соответствует?

Должен ли я использовать пользовательское событие или itemEditor или что-то еще полностью?

Answer 1

Thanks Joel. Вот окончательное решение, которое я придумал после прочтения этой статьи (которую я читал раньше). Я хочу добавить элемент, 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); 
     } 
    } 
} 

Answer 2

Вам нужно сделать itemRenderer классом, а затем ссылаться на свой DataGrid из этого класса, используя the methods described here. Затем вы можете отправлять события из DataGrid, которые легко слушать в контейнере, который его поддерживает. То, что вы не хотите делать, это полагаться на пузырь или пытаться напрямую прослушивать itemRenderer. Возможно, вам захочется создать настраиваемое событие, которое несет свойство данных строки DataGrid, чтобы ваш слушатель событий мог быстро получить доступ к этой информации.