PDA

View Full Version : How to add a context menu for a menu?



andong
5 Jul 2012, 6:35 PM
Just like the desktop example, I want to add a context menu for the start menu items, so that I can create a desktop shortcut item more comfortably.

I found no contextmenu or itemcontextmenu events in the menu item class, and also no mouse right click event.

Anyone know how to do it?

Thanks.

andong
8 Jul 2012, 6:43 PM
Does anyone can give me a hand?

scottmartin
8 Jul 2012, 7:15 PM
You could use something like:



var button = Ext.create('Ext.Button', {
text: 'Click me',
renderTo: Ext.getBody(),
handler: function() {
alert('You clicked the button!');
}
});

contextMenu = new Ext.menu.Menu({
items: [{
text: 'Menu Item'
}]
});

button.getEl().on('contextmenu', function(e) {
e.preventDefault();
contextMenu.show(button.getEl());
});


Scott.

andong
8 Jul 2012, 8:57 PM
Thanks, I'll try this way.

andong
9 Jul 2012, 1:14 AM
I have added a context menu to a menu item by codes below:

listeners:
{
render: function(item)
{
item.getEl().on('contextmenu', function(e)
{
e.stopEvent();
startMenuContextMenu.showAt(e.getXY());
});
}
}

Thanks scottmartin very much!

But another issue is coming, when I right click the start menu, the context menu was displayed correctly, but the start menu was hidden. There was only a context menu displayed there.

How to keep the start menu displaying?

andong
10 Jul 2012, 5:41 PM
I have found the solution for the start menu issue by myself.

Just set the allowOtherMenus property to true of the menu.

HybrideRD3
12 Jul 2012, 2:10 PM
How can we get the menu item where the user right-clicked?

scottmartin
12 Jul 2012, 2:21 PM
You can use menu.setPosition(x,y) to place it where you want

andong
12 Jul 2012, 7:19 PM
How can we get the menu item where the user right-clicked?

You can use a global var to remember the latest menu item in contextmenu event.

HybrideRD3
13 Jul 2012, 10:00 AM
Duh.. Yes, it's simple. Thanks