ExtJS Grid Panel - Mehrere "Zeilen" pro Zeile?

Question

Wir haben ein ExtJS Grid-Panel, das gewachsen ist, um zu viele Spalten (imo), enthalten, so dass ich in enfolding einige Daten in "Sub-Zeilen" der Hauptzeile suchen. Wie:

Daten1 | Daten2 | Daten3 | Daten4 | Daten5
Einige zusätzliche Daten, die sich auf
Daten1 | Daten2 | Daten3 | Daten4 | Daten5
Einige zusätzliche Daten, die sich auf

Ich bin mir bewusst, dass die expander Plugin, aber wir bräuchten die Funktion zum Auf- und Zuklappen nicht und müssten die Unterzeilen immer offen haben.

Irgendwelche Gedanken oder Ideen?

Vielen Dank im Voraus.

Answer 1

Wenn Sie ExtJS-4 verwenden,

// ...
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]
    // ...
});

Wenn Sie ExtJS-3 verwenden, versuchen Sie es:

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';
        }
    }

Answer 2

Sie müssen ein verschachteltes Raster mit Hilfe des Expander-Plugins implementieren. Beim Klick- oder Expander-Ereignis können Sie die ID Ihrer Zeile als Schlüssel zum Laden der Unterzeilen verwenden.