javascript - Extjs Grid 面板 - 渲染后更改 enableColumnHide 属性

Question

请帮忙！我正在使用 ExtJs 4.1 网格面板。

我正在寻找一种在渲染后更改网格 enableColumnHide 属性的方法。我在几个屏幕上重复使用相同的网格，并进行了细微的更改，主要是隐藏了一些列。

在其中一个屏幕中，我只剩下不应隐藏的列，因此我想从列标题菜单中完全删除该选项，但在进入其他屏幕之一时将其恢复。

有任何想法吗？

Answer 1

我之前也遇到过类似的问题。你可以在这里查看我的解决方法：

Extjs Grid 面板 - 使用 hideable=false 隐藏列

基本上我已经注册到网格标题菜单的“beforeshow”事件，并根据每列上的“隐藏”属性隐藏菜单上的每个可隐藏列复选框项目。

你可以用“enableColumnHide”做同样的事情（只是隐藏“列”子菜单，它只是一个菜单项本身）

Answer 2

似乎没有明显的方法可以做到这一点，但我发现了一个 hack -每次更改该值时都会更改并销毁标题菜单enableColumnHide。headerCt示例代码：

var checkbox = new Ext.form.field.Checkbox({
    renderTo: 'checkbox',
    boxLabel: 'enableColumnHide',
    checked: true,
    handler: function(sender, checked) {
        var h = grid.headerCt;
        h.enableColumnHide = checked;
        if (h.menu) {
            h.menu.destroy();
            h.menu = null;
        }
    }
});

通过在列上使用可隐藏也可以：

var checkbox = new Ext.form.field.Checkbox({
    renderTo: 'checkbox',
    boxLabel: 'enableColumnHide',
    checked: true,
    handler: function(sender, checked) {
        Ext.each(grid.columns, function(c){
            c.hideable = checked;
        });
    }
});

工作示例enableColumnHide：http: //jsfiddle.net/M3Aqq/5/

工作示例hideable：http: //jsfiddle.net/M3Aqq/9/