我正在使用extjs4和c#开发一个应用程序,它基于browser-layout example。 我在左侧有一个菜单,您可以在其中单击该菜单的每个项目。在右侧,我有我所有的标签。
我在选项卡上使用的事件监听器在我单击选项卡时起作用,但是在第一次从左侧菜单中单击后,无法正常工作。
更清楚的是,当我第一次加载我的应用程序时,我必须从左侧菜单中选择一个项目,然后显示我的选项卡并激活tab1。一切都运作良好,但是当我选择另一个项目然后返回我的标签时它不起作用。
这是我的倾听者:
listeners: { activate: function () {
alert('tab1');
}
},
以下是单击菜单时调用的代码:
menuPanel.getSelectionModel().on('select', function (selModel, record) {
if (record.get('leaf')) {
Ext.getCmp('content-panel').layout.setActiveItem(record.getId() + '-panel');
Ext.getCmp('cardTabs').setActiveTab(0);
}}
提前致谢!
答案 0 :(得分:2)
检查以下网址:
var sample1 = {
id : 'example1',
border : false,
title : 'sample1'
};
var sample2 = {
id : 'example2',
border : false,
title : 'sample2'
};
Ext.create('Ext.tab.Panel',{
title : 'example',
width : 300,
height : 300,
draggable : false,
plain : true,
id : 'examplepanel',
activeTab : 0,
border : true,
renderTo : document.body,
items : [sample1,sample2],
listeners : {
beforetabchange : function(tab,newTab,currentTab){
if(newTab.getId() == 'example1'){
alert('sample1 tab is selected');
}else if(newTab.getId() == 'example2'){
alert('sample2 tab is selected');
}
}
}
});
答案 1 :(得分:1)
最好使用beforetabchange
而不是activate
侦听器。请尝试以下方法:
listeners : {
beforetabchange : function(tab, newTab, currentTab){
if(newTab != null){
if(newTab.getId()=='tab1'){
alert('tab1');
}
}
}
}
如上所述,您可以为要执行的每个选项卡编写侦听器。
答案 2 :(得分:1)
解决
我在我的tabpanel中添加了一个监听器
listeners: { tabchange: function () {
//refresh
switch (this.getActiveTab().id) {
case 'myId1': myFunction();
.........
}
},