Examples
Kitchen Sink
A table with all plugins enabled, including:
- multi-sorting
- column and table filtering
- column re-ordering and hiding
- pagination
- row grouping and aggregation
- row expansion
- row selection
- column resizing
INFO
Source code available on the REPL.
Hidden columns
Pagination
1 of 50
Column order
Name (1000 records, 20 in page)
|
Info (1000 samples)
|
|||||||
---|---|---|---|---|---|---|---|---|
Summary
|
First Name
|
Last Name
|
Age
|
Status
|
Visits
to
|
Profile Progress
|
||
Sylvia Watsica, 27
60 / 100 |
Sylvia | Watsica | 27 | single | 85 | 60 | ||
Abbey Larkin, 24
75 / 100 |
Abbey | Larkin | 24 | complicated | 27 | 75 | ||
Clovis Rowe, 20
3 / 100 |
Clovis | Rowe | 20 | single | 40 | 3 | ||
Marjolaine Zieme, 20
67 / 100 |
Marjolaine | Zieme | 20 | single | 68 | 67 | ||
Doyle Hills, 21
23 / 100 |
Doyle | Hills | 21 | relationship | 76 | 23 | ||
Javon Gutmann, 3
48 / 100 |
Javon | Gutmann | 3 | single | 6 | 48 | ||
Rashad Kohler, 14
27 / 100 |
Rashad | Kohler | 14 | complicated | 89 | 27 | ||
Cristal Blanda, 0
67 / 100 |
Cristal | Blanda | 0 | single | 92 | 67 | ||
Corine Hahn, 3
44 / 100 |
Corine | Hahn | 3 | relationship | 61 | 44 | ||
Orval Kub, 26
74 / 100 |
Orval | Kub | 26 | relationship | 29 | 74 | ||
Icie Bergstrom, 4
39 / 100 |
Icie | Bergstrom | 4 | single | 62 | 39 | ||
Conor Bayer, 11
63 / 100 |
Conor | Bayer | 11 | complicated | 16 | 63 | ||
Luis Heller, 11
21 / 100 |
Luis | Heller | 11 | complicated | 95 | 21 | ||
Roxanne Renner, 11
17 / 100 |
Roxanne | Renner | 11 | relationship | 44 | 17 | ||
Ferne Kassulke, 8
0 / 100 |
Ferne | Kassulke | 8 | complicated | 31 | 0 | ||
Jon Schaden, 9
1 / 100 |
Jon | Schaden | 9 | single | 91 | 1 | ||
Laura Farrell, 0
23 / 100 |
Laura | Farrell | 0 | relationship | 56 | 23 | ||
Jasper Jacobi, 13
47 / 100 |
Jasper | Jacobi | 13 | complicated | 87 | 47 | ||
Alysha Hartmann, 1
92 / 100 |
Alysha | Hartmann | 1 | complicated | 0 | 92 | ||
Tyrique Kuhn, 25
67 / 100 |
Tyrique | Kuhn | 25 | single | 41 | 67 |
{ "groupByIds": [], "sortKeys": [], "filterValues": {}, "selectedDataIds": { "1": true }, "columnIdOrder": [ "selected", "expanded", "summary", "firstName", "lastName", "age", "status", "visits", "progress" ], "hiddenColumnIds": [], "expandedIds": { "1": true }, "columnWidths": { "age": 100 } }