selected Menu item is reset (using TabPanel)
Posted on Jan 08, 2009 under xn--zqqs84h3is.com | editI've searched the forum and the document for few days but still no luck. Anyone can help?
Below is the sample code I modified from extjs.2.0.2examplestabtab-adv.js.
Ext.onReady(function(){
defaultThumbSizeValue = 'Small';
var tabs = new Ext.TabPanel({
renderTo:'tabs',
resizeTabs:true,
minTabWidth: 115,
tabWidth:135,
layoutOnTabChange: false, // i tried true/false, but still the same result
enableTabScroll:true,
width:600,
height:250,
defaults: {autoScroll:true},
plugins: new Ext.ux.TabCloseMenu()
});
// tab generation code
var index = 0;
while(index < 7){
addTab();
}
function onFolderThumbSizeMenuCheck(obj) {
if (obj.checked) {
defaultThumbSizeValue = obj.text;
alert(obj.text);
}
}
function addTab(){
var FolderThumbSizeMenu = new Ext.menu.Menu({
items: [
// stick any markup in a menu
{
text: 'Small',
value: 'Small',
checked: true,
group: 'thumbsize',
checkHandler: onFolderThumbSizeMenuCheck
}, {
text: 'Medium',
value: 'Medium',
checked: false,
group: 'thumbsize',
checkHandler: onFolderThumbSizeMenuCheck
}, {
text: 'Large',
value: 'Large',
checked: false,
group: 'thumbsize',
checkHandler: onFolderThumbSizeMenuCheck
}
]
});
var folder_toolbar = new Ext.Toolbar({
items: [
{
text:'Thumb Size' + (index+1),
iconCls: 'bmenu-icon', // <-- icon
menu: FolderThumbSizeMenu // assign menu by instance
}
]
});
index++;
var pl = new Ext.Panel({
title: 'New Tab ' + (index),
iconCls: 'tabs',
autoScroll:true,
closable:true,
//items: folder_view,
tbar: folder_toolbar,
html: 'Tab Body ' + (index) + '
'
});
tabs.add(pl).show();
}
new Ext.Button({
text: 'Add Tab',
handler: addTab,
iconCls:'new-tab'
}).render(document.body, 'tabs');
});
{
text: 'Small',
value: 'Small',
checked: true,
group: 'thumbsize_' + index,
checkHandler: onFolderThumbSizeMenuCheck
}, {
text: 'Medium',
value: 'Medium',
checked: false,
group: 'thumbsize_' + index,
checkHandler: onFolderThumbSizeMenuCheck
}, {
text: 'Large',
value: 'Large',
checked: false,
group: 'thumbsize_' + index,
checkHandler: onFolderThumbSizeMenuCheck
}
Later on if an new tab is created, the item which match will the value will be checked (the logic is not shown in this sample.
However, as shown in the screenshot, the menu item in previous tab was lost and unchecked.
Why would the menus in each of the toolbars magically synchronise their values?
#If you have any other info about this subject , Please add it free.# |
