EXT-JS 4.1: adding custom menu to grid column header without the default menu

Question

i want to add custom menu items to grid column header - which i can do, but apparently it's available only if the custom menu is available. but if i don't want my columns to be sortable or hideable, the custom menu isn't displayed. the way in which i create my custom menu is as follows:

    var menu = Ext.getCmp('pairsGrid').headerCt.getMenu();
    var customEls = menu.add([{
        xtype: 'menu',
        floating: false,
        items:[
            {
                text: 'Management',
                iconCls: 'edit',
                menu: {
                    xtype: "menu",
                    items: [
                        {
                            text: 'Start'
                        },{
                            text: 'Stop'
                        }
                    ]
                }                   
            }
        ]
    }]);

if in my columns config i have sortable: false and hideable: false my custom menu won't be displayed; otherwise, it's there. is there any other way to create the menu, or somehow have it visible without the default menu? cheers, eRez

Answer 1

You can force menu to be visible by overriding beforeRender method on column:

{
    text     : 'xxx',
    sortable : false,
    hideable : false,
    dataIndex: 'xxx',
    beforeRender: function() {
        Ext.grid.column.Column.prototype.beforeRender.call(this);
        this.menuDisabled = false;
    }
},

Sample: http://jsfiddle.net/sg9w7/1/