it-swarm.com.de

jQuery Bildlaufbare, sortierbare, filterbare Tabelle

Ich möchte jQuery verwenden, um einige sehr häufige Anfragen zu bearbeiten, die wir für Datentabellen unterschiedlicher Größe erhalten: Scrollen, Sortieren und dynamisches Filtern.

  • Ich habe das Scrollen in der Vergangenheit mit zwei separaten Tabellen mit Spalten mit fester Breite und zugehörigen Div-Containern für das "tatsächliche" Scrollen erledigt. Diese Methode funktioniert jedoch nicht mit den jQuery-basierten Sortiertabellenerweiterungen, auf die ich gestoßen bin (Tablesorter ist bisher mein Favorit), da sie alles in einer einzigen Tabelle haben möchten.
  • Zum Filtern fordern sie etwas an, wie es in Excel- und SharePoint-Listen der Fall ist (im Wesentlichen werden alle Spaltenwerte in einer Dropdown-Liste aufgeführt, sodass der Benutzer sie auswählen bzw. die Auswahl aufheben kann). Ich habe so etwas noch nicht gesehen, obwohl es möglich klingt.
  • Ein weiteres verwandtes Nice-to-Have-Feature wäre die Möglichkeit, eine Spalte für horizontales Scrollen "einzufrieren".

Idealerweise hätte ich gerne eine bestehende Erweiterung, aber wenn keine da ist, würde ich mich auch über Vorschläge von jQuery-Gurus freuen, wie man sie am besten umsetzt. Meine derzeitigen Gedanken sind, in den Tablesorter einzutauchen und ihn bei Bedarf zu erweitern/zu aktualisieren.

Um hoffentlich die Dinge auf den Punkt zu bringen, ist Paging keine Option (zusammen mit allem Server-basierten).

Update: Ich schätze die bisherigen Antworten sehr, aber keine der bisher gegebenen Optionen berührt den Filteraspekt (das heißt, ich muss zugeben, dass jqGrid für einige zukünftige Projekte, die ich habe, sehr gut aussieht ). In der Zwischenzeit werde ich an einer benutzerdefinierten Filterlösung arbeiten. Wenn es klappt, werde ich es erneut aktualisieren.

25
pdwetz

Ich bin auf diese Frage gestoßen, als ich selbst nach einem sortierbaren Tabellen-Plugin suchte. Ich war mit keinem der vorgeschlagenen Widgets wirklich beeindruckt, aber später entdeckte ich DataTables und war ziemlich beeindruckt. Ich empfehle es mir auszuprobieren.

12
Jeremy Holovacs

Vielleicht könnte dieses exzellente Plug-In dies tun:

Demo-Seite

Es heißt jQGrid, hier ist die Projektseite: http://plugins.jquery.com/project/jqGrid

8
matdumsa

Ich möchte Sie dazu ermutigen, Flexigrid auszuprobieren.

Es hat viele großartige Funktionen und ich persönlich denke, dass es professioneller aussieht als das jqGrid.

Es gibt nicht einige der Funktionen, nach denen Sie fragen, aber ich denke, es könnte ein guter Anfang sein. Es wäre großartig, wenn Sie daran arbeiten könnten, einige dieser Features zur Codebasis hinzuzufügen.

Wenn Sie in c # codieren, habe ich einen Blogeintrag über die Verwendung von LINQ to Reflection zum Binden von JSON an das Flexigrid veröffentlicht. Wenn Sie eine andere Sprache verwenden, finden Sie weitere Beispiele unter Flexigrid Website & Google Group Seite.

4
Elijah Manor
3
farinspace

Wie in meinem Update erwähnt, verwendete ich eine benutzerdefinierte Filtererweiterung (leider geschlossenes Quellsystem). Ich habe vor kurzem mit SlickGrid angefangen und es ist jetzt mein Startplatz.

1
pdwetz

Ich möchte die mit Laravel ausgestatteten DataTables ( GitHub , jquery DataTables API ) hinzufügen - perfekt, wenn Sie bereits mit PHP/Laravel arbeiten.

Extra, Koalyptus/TableFilter eine andere benutzerdefinierte Filtertabelle (eigentlich mein Favorit).

0
wp78de