Overview

Create, read, update, and delete Tree Grid records using built-in or custom editors. Editing is suitable for local JSON data and remote data sources managed through the data manager.


Edit modes

Edit records using cell, row, or dialog modes, with programmatic editing also supported. Editing modes are suitable for applications that require different record-editing interactions.


Batch editing and saving bulk changes in React Editable Tree Grid.

Batch editing

Add, edit, or delete multiple records and submit the accumulated changes together. Batch editing is suitable for scenarios that require several record changes to be processed in a single update.


Add row position

Insert new records above or below a selected record, as a child record, or at the top or bottom of the data source. Record positioning is suitable for hierarchical datasets that require new items to be inserted at specific levels or locations.


React Tree Grid using custom edit UI.

Custom editor

Configure the editor type used for individual Tree Grid columns and define custom editors where required. Column-specific editors are suitable for fields that require different input controls or editing behavior.


Validation

Validate cell or row values during editing using configurable validation rules and messages. Input validation is suitable for Tree Grids that require entered values to follow defined data requirements before updates are applied.

React Tree Grid with Validation.


Explore all Syncfusion React components

Explore over 140+ React UI components featuring established, and production-ready controls built for modern web app development.

Scroll up icon
Syncfusion Feedback