Extjs网格列标题,将下拉菜单项添加到特定列

Question

我正在尝试向网格中的列标题下拉菜单添加一个按钮.但是,我只想将它添加到具有某些itemId的列中.到目前为止,我已经将按钮添加到所有列,请参阅下面的代码.我不知道在哪里可以检查每个列的itemId,但它似乎没有遍历列.这有什么解决方法吗？谢谢!

items:[{
            region:'center',
            xtype:'grid',
            columns:{
                    items: COLUMNS, //defined in index.php
            },
            store:'Items',
            selType: 'checkboxmodel',
            listeners: {
                    afterrender: function() {        
                            var menu = Ext.ComponentQuery.query('grid')[0].headerCt.getMenu();
                            menu.add([{
                                    text: 'edit',
                                    handler: function() {
                                            console.log("clicked button");
                                    }
                            }]);           
                    }
            }
    }],

Answer 1

网格列菜单存在于一个实例中,该实例为所有列共享.因此,您无法仅为一列添加菜单项.

但是,您可以在此菜单中显示/隐藏特定列的菜单项.您可以使用菜单beforeshow事件并从menu.activeHeader属性获取有关列的信息:

listeners: {
    afterrender: function(c) {                                        
        var menu = c.headerCt.getMenu();

        // add menu item  into the menu and store its reference
        var menuItem = menu.add({
            text: 'edit',
            handler: function() {
                console.log("clicked button");
            }
        });

        // add listener for beforeshow menu event
        menu.on('beforeshow', function() {

           // get data index of column for which menu will be displayed
           var currentDataIndex = menu.activeHeader.dataIndex; 

            // show/hide menu item in the menu
            if (currentDataIndex === 'name') {
                menuItem.show();
            } else {
                menuItem.hide();
            }
        });
    }
}

提供实例:https://fiddle.sencha.com/#fiddle/3fm