gridview - ExtJS 4 网格标题中未显示子菜单项

Question

我正在尝试在网格标题中创建一个包含一些子菜单的菜单，但现在显示了子菜单项。这是我如何getColumnMenu()覆盖Ext.grid.header.Container：

Ext.override(Ext.grid.header.Container, {
    /**
     * Returns an array of menu CheckItems corresponding to all immediate children of the passed Container which have been configured as hideable.
     */
    getColumnMenu: function (headerContainer) {
        // debugger
        var xmenu = new Ext.menu.Menu({
            style: {
                overflow: 'visible'
            },
            items: [{
                text: 'Category 1',
                menu: [{
                    text: 'Item 1.1',
                    checked: true,
                    checkHandler: this.onColumnCheckChange
                }, {
                    text: 'Item 1.2',
                    checked: false,
                    checkHandler: this.onColumnCheckChange
                }]
            }, {
                text: 'Category 2',
                menu: [{
                    text: 'Item 2.1',
                    checked: true,
                    checkHandler: this.onColumnCheckChange
                }, {
                    text: 'Item 2.1',
                    checked: false,
                    checkHandler: this.onColumnCheckChange
                }]
            }]
        });

        var test = [];
        xmenu.items.each(function (item) {
            test.push(item);
        });
        return test;

    }
});

菜单类别 1 和类别 2 如下所示：

但是当我尝试显示他们的子菜单时，我收到一个错误：

不知何故是parentMenu菜单的属性undefined。有什么建议么？

Answer 1

老实说，我不太确定您的代码为什么不起作用。我只是试图组织菜单和菜单项的创建，它奏效了。我使用了以下代码

getColumnMenu: function(headerContainer) {
    var menuItems = [];

        /* CATEGORY 1 */
        var itemsOneMenu = Ext.create('Ext.menu.Menu', {
            items: [{
                text: 'Item 1.1',
                checked: true,
                checkHandler: this.onColumnCheckChange
            },{
                text: 'Item 1.2',
                checked: false,
                checkHandler: this.onColumnCheckChange
            }]
        });

         categoryOneMenuItem = Ext.create('Ext.menu.Item', {
            text: 'Category 1',
            hideOnClick: false,
            menu: itemsOneMenu
        });

        /* CATEGORY 2 */
        var itemsTwoMenu = Ext.create('Ext.menu.Menu', {
            items: [{
                text: 'Item 2.1',
                checked: true,
                checkHandler: this.onColumnCheckChange
            },{
                text: 'Item 2.1',
                checked: false,
                checkHandler: this.onColumnCheckChange
            }]
        });

        categoryTwoMenuItem = Ext.create('Ext.menu.Item', {
            text: 'Category 2',
            hideOnClick: false,
            menu: itemsTwoMenu
        });

    menuItems.push(categoryOneMenuItem,categoryTwoMenuItem);
    return menuItems;
}

在这里您可以找到一个运行示例http://jsfiddle.net/alexrom7/xheHn/。唯一的观察是 EXT 将继续侦听 CheckItem checkchange 事件以显示或隐藏选定的列。