I'm having trouble dynamically creating a dijit.Menu that opens with a left mouse button click. I have been successful dynamically creating a dijit.Menu that opens with a right mouse button click. I have also been successful declarative creating a dijit.Menu that opens with a left mouse button click.

I've include with this post some HTML that duplicates what works and what doesn't. The behavior of the HTML is the same in IE 6, FF 2/3, and Chrome. Hopefully, it will be simple to get up and running. Once it's running try the following...

Hi all,
I have a little problem with dijit.Menu. This is my method of its construction :

function menu(id){
if(dijit.byId("progMenu"))dijit.byId("progMenu").destroy();
var pMenu = new dijit.Menu({id:"progMenu"});
pMenu.addChild(new dijit.MenuItem({label:"Enable"}));
pMenu.addChild(new dijit.MenuItem({label:"Disable"}));
pMenu.addChild(new dijit.MenuSeparator());
pMenu.addChild(new dijit.MenuItem({label:"Remove"}));
pMenu.bindDomNode(dojo.byId(id));
}
I have two divs with onclick="menu(div's id)".

I got my menu displaying under the button. Now the display happens on click of the button. How can I display/toggle the menu on mouse over event? Has anyone tried this?

-ravi

Hey,

In case any others out there are being plagued by the dijit.Menu bug where it won't cleanly destroy itself -- this is a work around until they get it fixed.

Do the following after a menu closes (by attaching to "onClose" event of the menu)

dijit.byId( '/*id of menu*/' ).destroy(); //removes dijit registry entry for menu itself

//finds the orphaned menus on the body dom node and deletes the widgets.
dojo.forEach( dojo.query( ".dijitMenuTable" ).map(dijit.byNode), function( widget ){ widget.destroy(); } );