EXTJS 5 - 如何禁用菜单中的某些项目

时间:2016-12-07 14:32:55

标签: javascript jquery extjs

我正在使用菜单显示网格中行的多个选项。菜单正确显示文本,我希望能够动态地禁用其中一些选项。

这是我的菜单:

Ext.create('Ext.menu.Menu', {
items: [{
    text: 'option 1'
},{
    text: 'option 2'
},{
    text: 'option 3'
}]
});

我尝试过给每个项目一个id并通过id禁用它但我在控制台中收到错误

Uncaught TypeError: Cannot read property 'contains' of undefined(…)

有没有人知道这方面的解决方案?

2 个答案:

答案 0 :(得分:1)

您只需在disable上调用方法menuitem

var item = Ext.first('#mySpecialMenuItem');
item.disable();

这样的事情:

{
    xtype: 'menu',
    floating: false,
    id: 'myMenu',
    width: 120,
    items: [
        {
            xtype: 'menuitem',
            id: 'mySpecialMenuItem',
            text: 'Menu Item'
        },
        {
            xtype: 'menuitem',
            text: 'Menu Item'
        },
        {
            xtype: 'menuitem',
            text: 'Menu Item'
        }
    ]
},
{
    xtype: 'button',
    handler: function(button, e) {
        // somehow get the item
        var item = Ext.first('#mySpecialMenuItem');
        // call disable
        item.disable();

    },
    text: 'Disable Item'
}

查看这个小提琴中的完整示例 https://fiddle.sencha.com/#view/editor&fiddle/1m2q

答案 1 :(得分:0)

var menu=Ext.create('Ext.menu.Menu', {
items: [{
    text: 'option 1'
},{
    text: 'option 2'
},{
    text: 'option 3'
}]
});
var item=menu.getComponent(//index of the item)
item.setDisabled(true);