ExtJS网格面板-多个“;“行”;每排?

ExtJS网格面板-多个“;“行”;每排?,extjs,grid,extjs4,gridpanel,Extjs,Grid,Extjs4,Gridpanel,我们有一个ExtJS网格面板,它已经扩展到包含太多的列(imo),所以我正在研究将一些数据包含到主行的“子行”中。比如: 数据1 |数据2 |数据3 |数据4 |数据5 一些跨越的附加数据 数据1 |数据2 |数据3 |数据4 |数据5 一些跨越的附加数据 我知道有expander插件,但我们不需要展开/折叠功能,总是需要打开子行 有什么想法或想法吗 提前感谢。您需要做的是使用expander插件实现嵌套网格。在单击或展开事件中,您可以使用行的ID作为键来加载子行。如果您使用的是ExtJS-4

我们有一个ExtJS网格面板,它已经扩展到包含太多的列(imo),所以我正在研究将一些数据包含到主行的“子行”中。比如:

数据1 |数据2 |数据3 |数据4 |数据5
一些跨越
的附加数据 数据1 |数据2 |数据3 |数据4 |数据5
一些跨越
的附加数据

我知道有
expander
插件,但我们不需要展开/折叠功能,总是需要打开子行

有什么想法或想法吗


提前感谢。

您需要做的是使用expander插件实现嵌套网格。在单击或展开事件中,您可以使用行的ID作为键来加载子行。

如果您使用的是ExtJS-4

// ...
var rowBodyFeature = Ext.create('Ext.grid.feature.RowBody', {
    getAdditionalData: function(data, rowIndex, record, orig) {
        var headerCt = this.view.headerCt,
        colspan  = headerCt.getColumnCount();
        return {
            rowBody: "HELLO WORLD!", // do something with record
            rowBodyCls: this.rowBodyCls,
            rowBodyColspan: colspan
        };
    }
});

Ext.create('Ext.grid.Panel', {
    // ...
    features: [rowBodyFeature]
    // ...
});
如果使用ExtJS-3,请尝试:

new Ext.grid.GridPanel({
    //...
    viewConfig: {
        enableRowBody: true,
        getRowClass: function(record, rowIndex, p, store) {
            p.body = 'HELLOW WORLD: ' + record.get('attribute');
            return 'x-grid3-row-expanded';
        }
    }

您可以找到更多文档,包括示例,