Question

我有一个tabpanel，它是表单的一部分（输入字段在不同的选项卡上）。如果表单包含无效字段，即使它们不在当前选项卡上，我也需要通知用户提交。我认为最好的方法是更改标签颜色。

问题是如何在不引入新ID的情况下获取标签按钮的参考？

这是我试图做的事情，因为我引用了标签内部主体，并且还有一个直到整个标签面板

...
xtype:'tabpanel',
plain:true,
activeTab: 0,
height:190,
margin: '10 0 0 0',
items: [{
    title: 'Personal',
    layout:'column',
    border:false,
    items:[{
        columnWidth:.5,
        border:false,
        layout: 'anchor',
        defaultType: 'textfield',
        items: [{
             fieldLabel: 'Email',
             name: 'user[email]',
             allowBlank: false,
             listeners: {
                 'validitychange': function(th, isvalid, eOpts) {
                     if(!isvalid) {
                         alert(this.up().up().getId());
                     };
                 }
             },
             vtype:'email',
             anchor:'95%'
        }]
    }]
}]

Answer 1

试试这个：从您的字段或面板中的任何其他组件（如按钮）：

this.up('tabpanel').down('tab').el.applyStyles('background:red')

如果相关标签不是第一个标签，您可以在选择器中使用任何标签属性，如下所示：... down('tab[text=Example]')。如果你拥有它，你可以使用id属性，如果没有，你可以组成任何属性并将其设置为有意义的东西，如“ref：FirstTab”。

Answer 2

如果您有权访问 tabPanel ，则可以直接访问 tabBar 的项目：

this.up('tabpanel').getTabBar().items.get(0)
this.up('tabpanel').getTabBar().items.get(1)

等

请参阅http://docs.sencha.com/extjs/4.1.3/#!/api/Ext.tab.Bar-property-items

如何从内部参考tabpanels选项卡

2 个答案: