mx:PopUpMenuButton how to determine the source of a click

Question

Maybe I am trying to use the wrong component for what I want to do. I have a PopUpMenuButton with 2 items in it. I only want to take action when a user selects an item in the popup menu.

I have set the itemClick event to perform the necessary actions.

The button only displays the menu when the down arrow is clicked, but the itemClick event fires regardless of where the button is clicked. So I am getting the unwanted behavior of action being taken based on the last item selected without a menu being displayed/selected by the user.

How can I distinguish if the event occurred because the user clicked the menu down arrow or the main part of the button?

Should I be approaching this differently?

Thanks,

John

Answer 1

If you look at this example found here, you can see that the label property of the MenuEvent is accessible. As long as the items in the PopUpMenu have different labels, you can use some simple logic to determine which button was clicked like in the example.

Answer 2

How about listening to the popping up menu instance instead of the button?

Steps:

1. Adding open/close event handlers on the button.
2. In open/close event handler, we can add ITEM_CLICK event on the popping instance which is the menu exactly.

Code:

<fx:Script>
    <![CDATA[
        import mx.events.DropdownEvent;
        import mx.events.MenuEvent;

        protected function pmb_openHandler(event:DropdownEvent):void
        {
            pmb.popUp.addEventListener(MenuEvent.ITEM_CLICK,onMenuItemClick);
        }

        protected function pmb_closeHandler(event:DropdownEvent):void
        {
            pmb.popUp.removeEventListener(MenuEvent.ITEM_CLICK,onMenuItemClick);
        }

        private function onMenuItemClick(event:MenuEvent):void
        {
            trace(">>>onMenuItemClick on Menu : ", event.item.@label);  
        }

    ]]>
</fx:Script>
<fx:Declarations>
    <!-- A an data provider in E4X format. -->
    <fx:XMLList id="treeDP2">
        <node label="Inbox"/>
        <node label="Calendar"/>
        <node label="Deleted Items"/>
    </fx:XMLList>
</fx:Declarations>

<mx:HBox>
    <mx:PopUpMenuButton 
        id="pmb"
        dataProvider="{treeDP2}"
        labelField="@label"
        open="pmb_openHandler(event)"
        close="pmb_closeHandler(event)"
        />
</mx:HBox>