网格列中的 EXTJS 5.1 小部件 HEADER

Question

是否可以在网格面板列 header 中插入自定义小部件（例如按钮或复选框）？

从文档中看不清楚。我已经尝试 google 它，但没有成功。

请帮忙！

Answer 1

简短的回答是 'yes'。

您可以扩展网格列，然后制作一个后渲染监听器。

在监听器中，获取列的innerEl = (component.getEl().down('column-header-inner').

然后，像button/checkbox一样制作一个新组件，columnComponent.headerButton = new Ext.button.Button()

然后，渲染它 columnComponent.headerButton.render(innerEl).

希望对您有所帮助。

Answer 2

我遇到了同样的问题：如何将按钮（或任何自定义组件）放入 extjs 网格 header 字段中。

经过一番研究，我找到了 extjs 5 的解决方案：您可以配置网格列的 "items" 属性：

{
    xtype: "gridcolumn",
    text: "column header name in grid",
    dataIndex: "...",
    items:[
       {
           xtype: "button",
           text: "Foo",
           handler: "onFooClick"
       }
    ]
}

例如，这将在 header 组件内的网格 header 文本下方显示一个按钮。

网格列中的 EXTJS 5.1 小部件 HEADER

EXTJS 5.1 WIDGET IN GRID COLUMN HEADER

columnheader

extjs5