Question about referencing Objects

I'm trying to create a Context based MenuBar for the top of my application.

What I want is when a user clicks on a Container e.g. a Canvas, the top MenuBar changes. Also, the Events need to be sent back to the Container.

What I've tried without success:

1. Created a MenuBar in the main Application with the id "contextMenuBar"
2. Created Canvases with a public variable menuBar:MenuBar and instanciate it.
3. Assigned an XML dataProvider and event listeners to it.
4. When the user clicks on the Canvas I set Application.application.contextMenuBar = myMenuBar.

Doing this, the contextMenuBar just doesn't change at all.

I have also tried using addChild(menuBar), this appears to make a copy of the menuBar and I loose the listeners.

CanvasWithMenuBar class

Code:

---

package com.ab.containers
{
        import mx.containers.Canvas;
        import mx.controls.MenuBar;

        public class CanvasWithMenuBar extends Canvas
        {
                [Inspectable] public var menuBar:MenuBar;
               
                public function CanvasWithMenuBar()
                {
                        super();
                        menuBar = new MenuBar();                       
                }
               
        }
}

---

Application MXML

Code:

---

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:ns1="com.ab.containers.*">

        <mx:Script>
                <![CDATA[
                        import mx.events.MenuEvent;               
                        import com.ab.containers.CanvasWithMenuBar;
                        import mx.controls.MenuBar;       
                        import mx.controls.Alert;               

                        private function init():void
                        {
                               
                                //menu
                               
                                var menuXML:XML =        <n>
                                                                                <n label="menu1" action="action1"/>
                                                                                <n label="menu2" action="action2"/>
                                                                        </n>;
                                                       
                                canvas1.menuBar.dataProvider = menuXML;
                               
                                //Add listeners
                                canvas1.menuBar.addEventListener(MenuEvent.ITEM_CLICK, menuItemClickListener);
                        }
                       
                        public function menuItemClickListener(e:MenuEvent):void
                        {
                                Alert.show(String(e.item.@action));
                        }
                       
                        private function setContextMenu(e:Event):void
                        {
                                contextMenuBar = MenuBar(e.currentTarget.menuBar);
                        }
                                                       
                ]]>
        </mx:Script>

        <ns1:CanvasWithMenuBar x="63" y="174" width="100" height="100" id="canvas1" click="setContextMenu(event)" backgroundColor="#FF0000" useHandCursor="true" buttonMode="true">
        </ns1:CanvasWithMenuBar>
        <mx:MenuBar x="0" y="0" width="100%" id="contextMenuBar"></mx:MenuBar>
       
</mx:Application>

---

Hopefully this makes sense.

Any Ideas?