[flexcoders] how to bubble and catch events

[stevepruitt97]

I have the following scenario.  I need to catch the click events for 
either of the two buttons.  I tried putting the event handler on the 
DataGrid, but I'm getting an unresolved error for it.  Is this even 
possible?

Thanks in advance for any help.

-S

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml";>
    <mx:Script>
            <![CDATA[
                import mx.collections.ArrayCollection;
                import 
mx.controls.dataGridClasses.DataGridItemRenderer;

                [Bindable]
                private var _content : ArrayCollection = new 
ArrayCollection();

                :
                :

                private function onAction(event : Event) : void
                {
trace("got action: " + event.target.id);
                }
            ]]>
        </mx:Script>
    <mx:DataGrid id="templateGrid"  width="100%" height="100%" 
rowCount="5" dataProvider="{_content}" action="onAction(event)">
        <mx:columns>
            <mx:DataGridColumn id="actionColumn" headerText="Action">
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:ViewStack>
                            <mx:Metadata>
                                [Event(name = "action", type 
= "flash.events.Event")]
                            </mx:Metadata>
                            <mx:Script>
                            <![CDATA[
                                private function onAction(event : 
Event) : void
                                {
trace("action: " + event.target.id);
                                    var e : Event;
    
                                    if(event.target.id == "adder")
                                        e = new Event(Event.ADDED, 
true);
                                    if(event.target.id == "deleter")
                                        e = new Event(Event.REMOVED, 
true);
    
                                    dispatchEvent(e);
                                }
                            ]]>
                            </mx:Script>
                            <mx:Text text=""/>
                            <mx:Button id="adder" label="Add" 
click="onAction(event)"/>
                            <mx:Button id="deleter" label="Delete" 
click="onAction(event)"/>
                        </mx:ViewStack> 
                    </mx:Component>
                </mx:itemRenderer>
            </mx:DataGridColumn>
            <!--mx:DataGridColumn dataField="index" headerText="ID"/--
>
            <mx:DataGridColumn dataField="title" 
headerText="Template"/>
            <mx:DataGridColumn dataField="description" 
headerText="Description"/>
            <mx:DataGridColumn dataField="version" 
headerText="Version"/>
        </mx:columns>
    </mx:DataGrid>
</mx:Canvas>