addSortBy
addSortBy sorts table rows by column values.
Options
Information:
Options passed into
addSortBy.const table = createTable(data, {
sort: addSortBy({ ... }),
});const table = createTable(data, {
sort: addSortBy({ ... }),
});initialSortKeys?: SortKey[]
Sets the initial sort keys.
Defaults to [].
disableMultiSort?: boolean
Disables multi-sorting for the table.
Defaults to false.
isMultiSortEvent?: (event: Event) => boolean
Allows overriding the default multi-sort behavior.
Takes an Event and returns whether the action triggers a multi-sort.
Defaults to multi-sort on shift-click.
toggleOrder?: ()[]
Allows customization of the toggling order. This cannot contain duplicate values. Set this to ['asc', 'desc'] to disable toggling to an unsorted column.
Defaults to ['asc', 'desc', undefined].
serverSide?: boolean
If true, the sort plugin will have no effect on the rows of the table. Instead, you can control sorting by updating $data. The plugin’s state can be used as variables in your data-fetching query to get sorted data from the server directly.
Defaults to false.
Column Options
Information:
Options passed into column definitions.
const columns = table.createColumns([
table.column({
header: 'Name',
accessor: 'name',
plugins: {
sort: { ... },
},
}),
]);const columns = table.createColumns([
table.column({
header: 'Name',
accessor: 'name',
plugins: {
sort: { ... },
},
}),
]);Examples
$sortKeys = []
| Name | Info | ||||
|---|---|---|---|---|---|
| First Name | Last Name | Age | Status | Visits | Profile Progress |
| Hudson | Lowe | 38 | relationship | 42 | 33 |
| Lila | Gleichner | 47 | complicated | 53 | 13 |
| Christina | Stehr | 41 | complicated | 85 | 8 |
| Anjali | Boyer | 24 | relationship | 60 | 22 |
| Daisy | Koss | 27 | complicated | 64 | 48 |
| Gia | McClure | 25 | complicated | 70 | 97 |
| Sienna | Mante | 38 | complicated | 44 | 78 |
| Vella | Bode | 35 | relationship | 85 | 41 |
| Delia | Ziemann | 64 | single | 80 | 60 |
| Cayla | Ledner | 35 | complicated | 4 | 99 |
| Joanne | Gerlach | 36 | complicated | 84 | 74 |
| Adonis | Glover | 45 | complicated | 2 | 66 |
| Jerry | Heller | 44 | relationship | 98 | 11 |
| Allene | Oberbrunner | 28 | complicated | 42 | 65 |
| Cecile | Sanford | 24 | single | 87 | 75 |
| Karianne | VonRueden | 46 | single | 34 | 26 |
| Hector | Mohr | 57 | complicated | 62 | 17 |
| Jena | Price | 29 | relationship | 18 | 11 |
| Adeline | Grimes | 26 | relationship | 9 | 28 |
| Edgar | Lowe | 58 | relationship | 99 | 4 |
| Luella | Strosin | 28 | single | 74 | 65 |
| Alexandre | Purdy | 22 | complicated | 3 | 36 |
| America | Baumbach | 36 | single | 67 | 20 |
| Holly | Greenfelder | 47 | relationship | 96 | 45 |
| Herminia | Lang | 43 | complicated | 4 | 16 |
| Melissa | Sanford | 42 | complicated | 96 | 33 |
| Nelda | Johns | 58 | relationship | 44 | 72 |
| Albina | Brakus | 49 | complicated | 28 | 20 |
| Tiara | Von | 51 | relationship | 50 | 51 |
| Abigale | Maggio | 60 | single | 68 | 85 |