2.5 KiB
| id | title | sidebar_label |
|---|---|---|
| basic-row-select | Row Selection | Row Selection |
For the table row selection functionality, the usage is almost same as react-bootstrap-table. If you are a user from legacy react-bootstrap-table, you can consider to skip this part.
Live Demo For Row Selection
API & Props Definition
Selection Mode
We support the single and multiple selection on table, config the selectRow.mode on BootstrapTable will enable the selection on the table.
By default behavior, user need to click on the selection column or the checkbox/radio to select/unselect a row, for a user experience perspective, we have selectoRow.clickToSelect to allow user to select/unselect row by clicking on the row.
Selection Management
Please check selectoRow.selected, it's used for default selection usually but also can be used as a external selection control.
This is an example for selection management
Customization
Style/Class
Like column, we support to custom the style, class on the selecting row easily via following selectRow props:
Selection Column
- For header cell:
selectRow.selectionRenderer - For normal cell:
selectRow.selectionHeaderRenderer
In addition, react-bootstrap-table2 offer below props to hide selection column:
selectRow.hideSelectColumn: Hide the selection column.selectRow.hideSelectAll: Hide the select all checkbox in the selection header cell.
Event Listening
selectRow.onSelect allow you to listen a row is select or unselect. For the multiple selection, we also have selectRow.onSelectAll to listen the select/unselect all event.