CustomEvent sent by Menu Item

[young_matthewd]

hej,

Subscribed a function to a menu item 'click' event which simply creates a custom event and fires it directly (see below):



...
var newResourceEvent = new YAHOO.util.CustomEvent('new resource');
var menuMessageEvent = new YAHOO.util.CustomEvent('menu message');

function fireNewResourceEvents() {
newResourceEvent.fireDirect();

menuMessageEvent.fireDirect('another message to myself');
}

...


the function above resides in a application-menubar.js file. And when I build my layout inside a application-layout.js file just after rendering I want to assign a listener to the status panel (i.e. 'south' region):


...
function handleMenuMessage(message) {
alert(message);
}

....

var statusPanel = getEl('south');
statusPanel.addManagedListener('menu message', handleMenuMessage);

...



the event gets fired by the clicking on the menu item but the "handleMenuMessage" function never reacts. Have I totally misunderstood the EventManager? Thought I could define an arbitary event anywhere and the type property (in this case 'menu message' or 'new resource') would uniquely identity the event to the listener (subscriber) on the Element object. Doesn't seem to be the case.

[jack.slocum]

That's not what it does. The EventManager just provides a normalized event object for events and some useful events such as onDocumentReady and onWindowResize.

You can add events to the panels though as they extend Observable. You would do something like this:

var foo = new YAHOO.ext.ContentPanel(...);
// no spaces in event name
foo.events['menuevent'] = new YAHOO.util.CustomEvent('menuevent');
....
foo.on('menuevent', myFunction);

To fire the event, you'd call:

foo.fireEvent('menuevent', arg1, arg2, etc);

or from inside the foo object:

this.fireEvent('menuevent', arg1, arg2, etc);