隐藏ExtJS网格列标题

Question

我知道我可以使用代码隐藏网格列标题。

#gridid .x-grid3-hd-row { display:none; }

但我不想使用任何CSS更改。如何使用JavaScript做同样的事情？

Answer 1

你可以通过这种方式将其添加到 Ext.grid.GridPanel 来轻松完成：

hideHeaders: true

Answer 2

您可以将hideHeaders configuration option of the GridPanel设置为true。或者你的意思是在网格渲染后？

已修改：如果您要更改（或禁用）标头的创建方式，您还可以覆盖renderHeaders或updateHeaders GridView。另一种方法是将templates选项传递给GridView，将header值设置为空模板而不是默认值：

ts.header = new Ext.Template(
    '',
    '{cells}',
    '
'
);

虽然默认实现在this.innerHd中写入标头，innerHd定义为this.mainHd.dom.firstChild，如果this.mainHd选项，则hideHeaders设置为隐藏已设定。所以我希望该选项也会影响列标题。

编辑：我们在谈论什么版本的ExtJS？我看了the current source，我猜是3.1。

Answer 3

只需将hideHeaders: true添加到您的网格中即可。它应该工作

Answer 4

您可以将其添加到网格定义中：

listeners: {
    render: function(grid) {
        grid.getView().el.select('.x-grid3-header').setStyle('display', 'none');
    }
},

Answer 5

通常，当您将网格放入面板时，您最终会想要这样做。

对我来说，css hacks似乎很糟糕，只有这样才有效：

preventHeaders: true

查看属性here in the docs.