Row Selection
The ability to select rows in the table.
State
Row selection state is stored on the table using the following shape:
export type RowSelectionState = Record<string, boolean>
export type RowSelectionTableState = {
rowSelection: RowSelectionState
}
export type RowSelectionState = Record<string, boolean>
export type RowSelectionTableState = {
rowSelection: RowSelectionState
}
Table Options
enableRowSelection
enableRowSelection?: boolean | ((row: Row<TData>) => boolean)
enableRowSelection?: boolean | ((row: Row<TData>) => boolean)
- Enables/disables row selection for all rows in the table OR
- A function that given a row, returns whether to enable/disable row selection for that row
enableMultiRowSelection
enableMultiRowSelection?: boolean | ((row: Row<TData>) => boolean)
enableMultiRowSelection?: boolean | ((row: Row<TData>) => boolean)
- Enables/disables multiple row selection for all rows in the table OR
- A function that given a row, returns whether to enable/disable multiple row selection for that row's children/grandchildren
enableSubRowSelection
enableSubRowSelection?: boolean | ((row: Row<TData>) => boolean)
enableSubRowSelection?: boolean | ((row: Row<TData>) => boolean)
Enables/disables automatic sub-row selection when a parent row is selected, or a function that enables/disables automatic sub-row selection for each row.
(Use in combination with expanding or grouping features)
onRowSelectionChange
onRowSelectionChange?: OnChangeFn<RowSelectionState>
onRowSelectionChange?: OnChangeFn<RowSelectionState>
If provided, this function will be called with an updaterFn
when state.rowSelection
changes. This overrides the default internal state management, so you will need to persist the state change either fully or partially outside of the table.
Table API
getToggleAllRowsSelectedHandler
getToggleAllRowsSelectedHandler: () => (event: unknown) => void
getToggleAllRowsSelectedHandler: () => (event: unknown) => void
Returns a handler that can be used to toggle all rows in the table.
getToggleAllPageRowsSelectedHandler
getToggleAllPageRowsSelectedHandler: () => (event: unknown) => void
getToggleAllPageRowsSelectedHandler: () => (event: unknown) => void
Returns a handler that can be used to toggle all rows on the current page.
setRowSelection
setRowSelection: (updater: Updater<RowSelectionState>) => void
setRowSelection: (updater: Updater<RowSelectionState>) => void
Sets or updates the state.rowSelection
state.
resetRowSelection
resetRowSelection: (defaultState?: boolean) => void
resetRowSelection: (defaultState?: boolean) => void
Resets the rowSelection state to the initialState.rowSelection
, or true
can be passed to force a default blank state reset to {}
.
getIsAllRowsSelected
getIsAllRowsSelected: () => boolean
getIsAllRowsSelected: () => boolean
Returns whether or not all rows in the table are selected.
getIsAllPageRowsSelected
getIsAllPageRowsSelected: () => boolean
getIsAllPageRowsSelected: () => boolean
Returns whether or not all rows on the current page are selected.
getIsSomeRowsSelected
getIsSomeRowsSelected: () => boolean
getIsSomeRowsSelected: () => boolean
Returns whether or not any rows in the table are selected.
getIsSomePageRowsSelected
getIsSomePageRowsSelected: () => boolean
getIsSomePageRowsSelected: () => boolean
Returns whether or not any rows on the current page are selected.
toggleAllRowsSelected
toggleAllRowsSelected: (value: boolean) => void
toggleAllRowsSelected: (value: boolean) => void
Selects/deselects all rows in the table.
toggleAllPageRowsSelected
toggleAllPageRowsSelected: (value: boolean) => void
toggleAllPageRowsSelected: (value: boolean) => void
Selects/deselects all rows on the current page.
getPreSelectedRowModel
getPreSelectedRowModel: () => RowModel<TData>
getPreSelectedRowModel: () => RowModel<TData>
getSelectedRowModel
getSelectedRowModel: () => RowModel<TData>
getSelectedRowModel: () => RowModel<TData>
getFilteredSelectedRowModel
getFilteredSelectedRowModel: () => RowModel<TData>
getFilteredSelectedRowModel: () => RowModel<TData>
getGroupedSelectedRowModel
getGroupedSelectedRowModel: () => RowModel<TData>
getGroupedSelectedRowModel: () => RowModel<TData>
Row API
getIsSelected
getIsSelected: () => boolean
getIsSelected: () => boolean
Returns whether or not the row is selected.
getIsSomeSelected
getIsSomeSelected: () => boolean
getIsSomeSelected: () => boolean
Returns whether or not some of the row's sub rows are selected.
getCanSelect
getCanSelect: () => boolean
getCanSelect: () => boolean
Returns whether or not the row can be selected.
getCanMultiSelect
getCanMultiSelect: () => boolean
getCanMultiSelect: () => boolean
Returns whether or not the row can multi-select.
getCanSelectSubRows
getCanSelectSubRows: () => boolean
getCanSelectSubRows: () => boolean
Returns whether or not the row can select sub rows automatically when the parent row is selected.
toggleSelected
toggleSelected: (value?: boolean) => void
toggleSelected: (value?: boolean) => void
Selects/deselects the row.
getToggleSelectedHandler
getToggleSelectedHandler: () => (event: unknown) => void
getToggleSelectedHandler: () => (event: unknown) => void
Returns a handler that can be used to toggle the row.
Credits
- Row Selection - TanStack Table
v8
Docs