Question

我有以下标签定义：

var viewport = new Ext.Viewport({
      layout: 'fit',
      items: {
          xtype: 'grouptabpanel',
          tabWidth: 150,
          id: 'tabPanel',
          activeGroup: undefined,
          items: [aItems1]
      }
  });

其中aItems1是一个数组数组，例如：

aItems1[0] = {
    activeTab: 1,
    items: [{
            title: 'foo',
            tabTip: 'foo'
        }, {
            id: 'main-foo1',
            title: 'foo1',
            tabTip: 'foo1',
            iconCls: 'x-icon-page',
            style: 'padding: 10px;',
            layout: 'fit',
            items: [new Inp.Demands()]
        },
        {
            id: 'main-foo2',
            title: 'foo2',
            tabTip: 'foo2',
            iconCls: 'x-icon-exit'
        }
    ]
};

我需要activate标签main-foo2。

var tabPanel = Ext.getCmp('tabPanel');
tabPanel.setActiveTab('main-foo2');

但是这段代码没有改变任何东西。

使用tabPanel.setActiveTab(NUMBER)，我可以更改有效群组，但应该如何打开确切的标签？

Answer 1

看起来这个实现基本上（但不是实际）使用两个TabPanel。因此，为了设置有效标签，您需要为该组setActiveGroup和setActiveTab。

因此，考虑到要打开的标签的exactTabId，这样的内容可能会起作用：

var tab = Ext.getCmp(exactTabId);
var tabGroup = tab.ownerCt;
var groupingPanel = tabGroup.ownerCt;

groupingPanel.setActiveGroup(tabGroup);
tabGroup.setActiveTab(tab);

我使用GroupTabPanel和GroupTab作为可用方法的指南。

Answer 2

aItems1[0] = {
            activeGroup:1, //This property is used to activate a specific item
            items: [
                    {
                     title: 'foo',
                     tabTip: 'foo'
                },{
                     id:'main-foo1',
                     title: 'foo1',
                     tabTip: 'foo1',
                     iconCls: 'x-icon-page',
                     style: 'padding: 10px;',
                     layout:'fit',
                     items: [new Inp.Demands()]
                },{
                     id:'main-foo2',
                     title: 'foo2',
                     tabTip: 'foo2',
                     iconCls: 'x-icon-exit'
            }]
};

ExtJS 3.3.1 grouptabpanel如何更改选项卡

2 个答案: