PDA

View Full Version : How to handle remove tabpanel



vamshigurudu
11 Apr 2011, 3:29 AM
Hi,

How to handle removing tab panel. I mean when i close the tab panel i need
to do some background logic like saving in to database etc...
Below is my code, Is there any way to do it.
var tabs = new Ext.TabPanel({
renderTo:'dynamic-tabs',
activeTab: 0,
resizeTabs:true, // turn on tab resizing
minTabWidth: 115,
tabWidth:135,
enableTabScroll:true,
plain:true,
plugins: ['tabtitleedit'],
defaults:{autoScroll: true},
items:[{title:'abcd',id: 1,iconCls: 'tabs',closable:true},{title:'hhhh',id: 2,iconCls: 'tabs',closable:true}]

});

Thanks.

fay
11 Apr 2011, 4:43 AM
Add a close (http://dev.sencha.com/deploy/dev/docs/?class=Ext.TabPanel) (or beforeClose/beforeHide/beforeRemove) listener to your panels, e.g.,



function onPanelClose(p)
{
console.log(p.id);
}

var p1 = new Ext.Panel({
title:'abcd',id: 1,iconCls: 'tabs',closable:true,
listeners: {
'close': onPanelClose
}
});

var p2 = new Ext.Panel({
title:'hhhh',id: 2,iconCls: 'tabs',closable:true,
listeners: {
'close': onPanelClose
}
});

var tabs = new Ext.TabPanel({
renderTo:'dynamic-tabs',
activeTab: 0,
resizeTabs:true, // turn on tab resizing
minTabWidth: 115,
tabWidth:135,
enableTabScroll:true,
plain:true,
plugins: ['tabtitleedit'],
defaults:{autoScroll: true},
items:[p1, p2]
});

vamshigurudu
11 Apr 2011, 5:12 AM
Hi,

Thanks for the reply, it is working.

vamshigurudu
11 Apr 2011, 10:27 PM
HI,

I have another issue that when i am using closable:true.
The close icon is coming and using listener, it is working 5n.
But my issue is when i clicked on close the tab is disappeared, but i am using confirm there so that when clicked on yes then only the tab will disappear or closed. If you click on NO the tab should be remains same. Any help.

Thanks.

drian
11 Apr 2011, 11:10 PM
i would do something like this for each tab:



tab.on('beforeclose', function(p){
Ext.MessageBox.confirm('Confirm', 'Are you sure?', function(btn){
if(btn == 'yes'){
tabs.remove(p);
}
});
return false;
});

vamshigurudu
12 Apr 2011, 1:17 AM
Thanks for the reply. Iit is not working for me.

vamshigurudu
12 Apr 2011, 1:47 AM
tabs.on('beforeclose',fn...)

this is not working for my tabs.
Please see my code above.

The confirm box is coming but, if i click on No also the tab is closed.

Thanks

drian
12 Apr 2011, 8:18 AM
i've updated my post above. that will work now.

vamshigurudu
12 Apr 2011, 10:34 PM
HI Thanks a lot it is working now.