View Full Version : Tab Panel Context Menu

30 Apr 2007, 9:37 AM
Can anyone tell me if it is possible to add a context menu to a tab?


30 Apr 2007, 10:53 AM
Yes it is. Just look here (http://backoffice.kaffill.de/bookingrequest). Open one or more formulars by simple double click inside the script. Now move your mouse over the tabs and press the right mouse button :D

Look at this source may it is helpfull for you:

// ***********************************************************
Ext.apply(Ext.BorderLayout.prototype, {
// ***********************************************************
add: function (target, panel) {
target = target.toLowerCase();
panel = this.regions[target].add(panel);

var tabs = this.regions[target].getTabs();
if (tabs) {
var tab = tabs.getTab(panel.getId());
tab.events['contextmenu'] = true;
tab.el.on('contextmenu', panel.handlerContextMenu );

return panel;
// ***********************************************************
onContextMenu: function (e, item) {
// ***********************************************************

var region = App.getRegion()
var id = jQuery.trim(this.dom.parentNode.textContent);
var tab = App.layout.getRegion(region).getTabs().getTab('cp'+id);

App.tabContextMenu.tab = tab;
App.tabContextMenu.region = region;

var coords = e.getXY();
App.tabContextMenu.showAt([coords[0], coords[1]-50]);
// ***********************************************************
var id = 1;
var cp = new Ext.ContentPanel('cp'+id, {autoCreate: true, fitToFrame:true, autoScroll:true, handlerContextMenu: onContextMenu, title:'title', closable:true, disableTooltips: true });

tabContextMenu = new Ext.menu.Menu('tabContextMenu');
tabContextMenu.add({ id: 'cm_btn_closetab', text: 'Close current tab', action: 'closetab', handler: function() {alert('close current tab'); }, cls: 'btn_closetab' });
tabContextMenu.add({ id: 'cm_btn_closetabs', text: 'Close all tabs', action: 'closetabs', handler: function() {alert('close all tabs'); }, cls: 'btn_closetabs' });


30 Apr 2007, 12:58 PM
I will give that a try. Many thanks

11 Jul 2007, 1:37 PM
I have tested this.
Works fine but...

I have a complex Layout and when i use this "tip" on a tab, that work.
I have also some LayoutDialog witch containt some tab.

When I don't use contextmenu on a tab in the main layout (witch i use this tip), the tab in LayoutDialog is Ok. When i use juste one time contextmenu on a tab in the main layout, tab in LayoutDialog disappears....

It's very anoying because contextmenu on tab is very eyes candy ^^

Is somebody else have a right way to implement contexmenu on tab ?