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
|
||
Devan Osinski, 21
33 / 100 |
Devan | Osinski | 21 | complicated | 44 | 33 | ||
Tara Torp, 6
68 / 100 |
Tara | Torp | 6 | complicated | 48 | 68 | ||
Jacinthe Hyatt, 26
76 / 100 |
Jacinthe | Hyatt | 26 | relationship | 57 | 76 | ||
Adriel Bradtke, 12
88 / 100 |
Adriel | Bradtke | 12 | single | 41 | 88 | ||
Nicola Kunze, 1
92 / 100 |
Nicola | Kunze | 1 | single | 37 | 92 | ||
Doyle Haley, 27
18 / 100 |
Doyle | Haley | 27 | single | 85 | 18 | ||
Willy Harris, 15
48 / 100 |
Willy | Harris | 15 | complicated | 54 | 48 | ||
Izabella Beatty, 29
1 / 100 |
Izabella | Beatty | 29 | complicated | 52 | 1 | ||
Hulda Yost, 4
69 / 100 |
Hulda | Yost | 4 | single | 94 | 69 | ||
Enid Hudson, 8
33 / 100 |
Enid | Hudson | 8 | relationship | 74 | 33 | ||
Golden Swift, 8
57 / 100 |
Golden | Swift | 8 | relationship | 7 | 57 | ||
Ernesto Smitham, 4
66 / 100 |
Ernesto | Smitham | 4 | single | 36 | 66 | ||
Mya Funk, 22
52 / 100 |
Mya | Funk | 22 | complicated | 74 | 52 | ||
Tia Schuster, 9
78 / 100 |
Tia | Schuster | 9 | relationship | 35 | 78 | ||
Micah Kilback, 5
47 / 100 |
Micah | Kilback | 5 | complicated | 3 | 47 | ||
Melissa Herzog, 21
46 / 100 |
Melissa | Herzog | 21 | relationship | 93 | 46 | ||
Santina Medhurst, 26
9 / 100 |
Santina | Medhurst | 26 | complicated | 4 | 9 | ||
Samir Kub, 20
28 / 100 |
Samir | Kub | 20 | relationship | 39 | 28 | ||
Luna Collier, 3
65 / 100 |
Luna | Collier | 3 | relationship | 41 | 65 | ||
Josue MacGyver, 3
53 / 100 |
Josue | MacGyver | 3 | single | 48 | 53 |
{ "groupByIds": [], "sortKeys": [], "filterValues": {}, "selectedDataIds": { "1": true }, "columnIdOrder": [ "selected", "expanded", "summary", "firstName", "lastName", "age", "status", "visits", "progress" ], "hiddenColumnIds": [], "expandedIds": { "1": true }, "columnWidths": { "age": 100 } }