How to add a context menu for a menu?

[andong]

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]

Does anyone can give me a hand?

[scottmartin]

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]

Thanks, I'll try this way.

[andong]

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]

I have found the solution for the start menu issue by myself.

Just set the allowOtherMenus property to true of the menu.

[HybrideRD3]

How can we get the menu item where the user right-clicked?

[scottmartin]

You can use menu.setPosition(x,y) to place it where you want

[andong]

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]

Duh.. Yes, it's simple. Thanks