DevExtreme v24.2 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

React Tree List - Multiple Row Selection

This demo enables multiple selection mode. This mode allows users to press keyboard shortcuts or click checkboxes to select multiple rows.

The checkbox in the leftmost column header selects all rows. You can set the allowSelectAll property to false to disable the checkbox.

Multiple selection mode is non-recursive (when a row is selected, nested rows remain unselected). If users should select rows recursively, set the selection.recursive property to true. In this demo, you can use the checkbox under the TreeList component to toggle this property.

To give you the ability to edit code on the fly, the demo uses SystemJS. For this reason, launching the demo takes some time. We strongly recommend that you do not use this approach in real projects.
Backend API

TreeList includes an API to select multiple rows. For details, refer to the following article: Selection API.