2012-06-07 2 views
5

Ich verwende das jQuery dataTables-Plugin, um erweiterte Tabellen für unsere Anwendung zu erstellen. Eine der Anforderungen besteht darin, "faltbare" Zeilen (keine Gruppen!) Zu haben: z.B. Zeilen repräsentieren Kampagnen und möglicherweise untergeordnete Kampagnen. Die Struktur der untergeordneten Zeilen ist (im Grundfall) die gleiche wie in der übergeordneten Tabelle - gleiche Zellen, gleiche Datentypen.jQuery dataTables fügen mehrere faltbare Zeilen mithilfe der API-Funktion fnOpen() hinzu

Aber die untergeordneten Zeilen sollten nicht die Elterntabelle selbst beeinflussen: Ich meine, die Anzahl der Zeilen pro Seite sollte gleich bleiben, untergeordnete Zeilen sollten nicht getrennt von der übergeordneten Zeile sortiert werden, sie sollten immer gebunden bleiben . Daher kann ich fnAddData() API func dafür nicht verwenden.

Und die andere knifflige Anforderung ist die Möglichkeit, Multi-Level-zusammenklappbar Reihen (zB Kinder Kampagnen für Kinderaktionen, etc.) haben

ich die fnOpen wurde mit() API-Funktion für das, es erlaubt um eine beliebige Zeile zu "öffnen", hängt ein Kindblock an sie an, und Sie können dort im Allgemeinen einfügen, was Sie wollen. Es wurde funktioniert ganz gut in Datentabellen 1.8.2 verwendete ich Code wie folgt untergeordneten Zeilen zu generieren:

$(childRowData).each(function(){ 
    row = $(oTable.fnOpen(row.get(0), $(this), "child_row")); 
    $(row).addClass('child_row'); 
}); 

Im Allgemeinen ist es „geöffnet“ die aktuelle Zeile (oben definiert), eingefügten Daten in der untergeordneten Reihe, dann im Zyklus "geöffnet" die Kind-Zeile, fügte ein Kind, etc.

Aber ab dataTables 1.9.0 sieht aus wie es ist erlaubt, nur die übergeordneten Zeilen zu "öffnen", und tun Sie es nur einmal.

Natürlich kann ich eine Untertabelle erstellen, gelten $ .dataTable() zu ihm und es dem Kind Reihe einfügen, aber es scheint wie eine etwas lahm und teure Lösung, vor allem, wenn wir 3 haben könnten -4 Ebenen der Tiefe.

Gibt es eine andere Möglichkeit zum Implementieren von reduzierbaren Zeilen in DataTables?

+0

So, sieht aus, als gäbe es keine Möglichkeit, dies zu tun, ohne dataTables-Code zu ändern. Wir wollen das nicht machen, also musste ich mit den verschachtelten Tabellen gehen. –

Antwort

0

Wenn Sie die untergeordnete Zeile erstellen, die Unterkinder hat, ist es wahrscheinlich am besten, Ihre eigene Lösung zu rollen .. Ich habe einige Sachen vor ein paar Wochen mit Databases gemacht und das war das Beste, was ich mir vorstellen konnte .

6

Datentabellen wurde irgendwie aktualisiert und es ist sehr einfach jetzt für Kinder Zeilen Elternzeilen hinzu: http://datatables.net/reference/api/row().child()

Einer der Sache nicht wirklich offensichtlich, für den Fall ist, dass Sie die gleichen Layouts für Ihre Kinder Reihen verwenden möchten Wie bei den Elternzeilen müssen Sie den jquery-Selektor verwenden, um einen Knoten anstelle eines Strings zu übergeben (geschrieben in der Dokumentation, aber ich habe es beim ersten Mal verpasst).

Doint, die korrekt ist:

.child(
    $(
     '<tr>'+ 
      '<td>'+rowIdx+'.1</td>'+ 
      '<td>'+rowIdx+'.2</td>'+ 
      '<td>'+rowIdx+'.3</td>'+ 
      '<td>'+rowIdx+'.4</td>' 
     '</tr>' 
    ) 
) 

Aber tun das ist falsch: (es wird Ihre „tr“ in eine „td“ mit einem colspan von der Größe Ihrer Tabelle einfügen und es wird das offensichtlich brechen Spaltenausrichtung)

.child(
    '<tr>'+ 
     '<td>'+rowIdx+'.1</td>'+ 
     '<td>'+rowIdx+'.2</td>'+ 
     '<td>'+rowIdx+'.3</td>'+ 
     '<td>'+rowIdx+'.4</td>' 
    '</tr>' 
) 
+0

Sie haben heute ein Leben gerettet. Vielen Dank –

Verwandte Themen