Ext.TabPanel 在点击标签时根据条件判断是否允许切换，如何实现?

0 0

Ext.TabPanel 在点击标签时根据条件判断是否允许切换，如何实现?5

在tabs里动态载入几个小标签tab1，tab2，tab3……
我在标签切换的时候做了一个判断，如果不符合条件不允许切换标签。
但现在的结果是，我用beforetabchange事件可以得到想要的条件，点击tab2仍然会执行activate事件。
有什么办法能够在beforetabchange中阻止activate执行呢？

tabs.activate('act1');//显示第一个标签
tab2.on('activate', updater2.refresh, updater2, true);
tabs.on('beforetabchange',function(){
    alert("tabchanged!");
});

问题补充：return false;试过了，不行，它还是会执行tab2.on('activate',……)方法。

问题补充：

tabs.on('beforetabchange',function(){
          alert(1);
	return false;
	alert(2);
});

看上面的例子，只执行了alert(1)证明，return false，只是结束了当前beforetabchange方法的执行，而没有阻止tab2.on('activate',……)方法;
貌似，点击tab2执行了两个方法。
可以试试

tab2.on('activate', function() { 
alert('tab2'); 
return false;
}, true);

问题补充：

lizhi92574 写道

在切换面板的时候，下面这段代码触发beforetabchange事件。如果beforetabchange 返回值为false，就不进行切换面板。
if(!item || this.fireEvent('beforetabchange', this, item, this.activeTab) === false){
return;
}

你上面代码只会打印alert(1);并不会执行alert('tab2');

你使用的是什么版本的？

哦`Ext 1.x的版本。。。。。。

问题补充：

activate : function(id){
        var tab = this.items[id];
        if(!tab){
            return null;
        }
        if(tab == this.active){
            return tab;
        } 
        var e = {};
        this.fireEvent("beforetabchange", this, e, tab);
        if(e.cancel !== true && !tab.disabled){
            if(this.active){
                this.active.hide();
            }
            this.active = this.items[id];
            this.active.show();
            this.fireEvent("tabchange", this, this.active);
        }
        return tab;
    },

如上所述。。。很无语了。。。

JavaScript EXT

2010年10月18日 11:13

bf2624
18
0 0 3

4个答案按时间排序按投票排序

0 0

采纳的答案

this.fireEvent("beforetabchange", this, e, tab);
if(e.cancel !== true && !tab.disabled){

上面代码可以通过控制e的cancel属性控制。设置为true即可
tabs.on('beforetabchange',function(t,e){
e.cancel = true;
}

2010年10月18日 13:16

lizhi92574
2096
0 0 1

添加评论

0 0

2010年10月18日 12:51

lizhi92574
2096
0 0 1

添加评论

0 0

tab2.on('activate', function() {
alert('tab2');
}, true);
tabs.on('beforetabchange', function(t, p) {
if (p == tab2)
return false;
});
测试看看，应该不会出现你那问题。可能是你哪里写的有问题。

2010年10月18日 11:37

lizhi92574
2096
0 0 1