请帮忙!我正在使用 ExtJs 4.1 的网格面板。
我正在寻找一种方法,在渲染后更改网格的 enableColumnHide 属性。我在几个屏幕中重复使用同一个网格,只是进行了一些小的更改,主要是隐藏了一些列。
在其中一个屏幕上,我只剩下了不应该被隐藏的列,因此我想完全从列标题菜单中删除此选项,但当我到达其他屏幕时,要恢复它。
有什么建议吗?
请帮忙!我正在使用 ExtJs 4.1 的网格面板。
我正在寻找一种方法,在渲染后更改网格的 enableColumnHide 属性。我在几个屏幕中重复使用同一个网格,只是进行了一些小的更改,主要是隐藏了一些列。
在其中一个屏幕上,我只剩下了不应该被隐藏的列,因此我想完全从列标题菜单中删除此选项,但当我到达其他屏幕时,要恢复它。
有什么建议吗?
Extjs Grid panel - Hide a column with hideable=false
基本上,我在网格表头菜单的“beforeshow”事件中注册,并根据每列的“hideable”属性隐藏菜单中的每个可隐藏列复选框项。看起来似乎没有明显的方法可以做到这一点,但我找到了一个技巧 - 在headerCt
上更改enableColumnHide
并在每次更改该值时销毁标题菜单。示例代码:
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/