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 - Fixed and Sticky Columns

A horizontal scrollbar appears when the total width of all columns exceeds the TreeList component's width. To keep a column visible when scrolling, set the columnFixing.enabled property to true.

To fix a column programmatically, set its fixed property to true and select the column's fixedPosition:

  • 'left' (default if fixed: true)
    The column is fixed to the left edge of the grid.

  • 'right'
    The column is fixed to the right edge of the grid.

  • 'sticky'
    The column sticks to left and right edges when it reaches them.

To fix or unfix a column, users should right-click the column's header and select the corresponding operation in the context menu. To prevent users from fixing or unfixing a column, set its allowFixing property to false.

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