JavaScript TreeGrid - Syncfusion JavaScript UI Controls

The JavaScript TreeGrid is a feature-rich control used to visualize both self-referencial and hierarchical data effortlessly in a tree like tabular format. It offers many rich features such as data binding, editing, sorting, filtering, paging, aggregating rows, and exporting to Excel, CSV, and PDF formats.

Syncfusion HTML5 JavaScript TreeGrid

Features and Benefits

Data binding

JavaScript Bind Data seamlessly with various local and remote data sources such as JSON, RESTful services, OData services, and WCF services. JavaScript Tree Grid control uses the data manager to handle data and supports customizing data requests and processing.

Filtering

JavaScript Filtering in the JavaScript TreeGrid helps users to view the required data they need. It supports various filter types: filter bar and filter menu. The appropriate filter type can be chosen based on the application. These filter types support number, string, date, and Boolean. Options to customize filter operators, case sensitivity, and diacritics are also available.

Sorting

Users can sort a column by simply clicking on the header in JavaScript Tree Grid Sorting. A Ctrl + header click performs multi-sorting. Sort data in either ascending or descending order.

Paging

A segment of data from the assigned data source can be viewed through JavaScript Tree Grid Paging. The JavaScript Tree Grid has a built-in pager UI with customization options. It also has an on-demand paging mode for retrieving data from remote web services.

Editing

JavaScript Tree Grid with rich UI provides full support to create, read, update, and delete operations. With the assistance of the data manager, JavaScript Tree Grid Editing performs on a JSON collection or a remote data service.

Aggregation

Using the summary option, users can easily visualise the JavaScript Tree Grid Aggregates of the Tree Grid column values. With a collection of predefined summary categories, aggregates can be modified to display their importance in any hierarchy.

Templates

Using templates, users can create custom user experiences in the Tree Grid. There are various template options to create custom headers, custom cell contents, and toolbars.

Selection

Users can select rows or cells using JavaScript Tree Grid Selection operations. One or more rows or cells can also be selected by holding Ctrl or Command, or programmatically.

Responsive and touch-friendly

User-friendly touch gestures and an interactive UI design on JavaScript TreeGrid help produce the best user experience. All Tree Grid features work on touch devices with zero configuration. It is a mobile-first approach component. Its responsive user interface adapts automatically to any device and provides the best user experience to interact with the component. In addition, it has an option to hide specific columns for particular screen sizes using column-based media query support.

Stacked headers

Stacked headers allow grouping and visualizing column headers in a stacked manner. There is no limit to the number of columns that can be stacked. The data columns can still be sorted and filtered.

Column chooser, resize, reorder, and foreign key column

JavaScript Tree Grid Columns define the schema of a data source in Tree Grid. Features include formatting, column definitions, text wrapping, column chooser, column menu, column reordering, and other important features.

Web framework integration

TreeGrid component is also available in Blazor, React, Angular, and Vue frameworks. Check out the different TreeGrid platforms from the links below,

Learn More about Javascript Tree Grid

Download Free Trial

Pricing

Documentation

View Demos

Community Forums

Suggest a feature

About Syncfusion Javascript UI Controls

The Syncfusion Javascript UI controls library is the only suite that you will ever need to build an application since it contains over 70 high-performance, lightweight, modular, and responsive UI controls in a single package. In addition to Tree Grid, we provide popular Javascript Controls such as Javascript DataGrid, Javascript Charts, Javascript Scheduler, Javascript Diagram, and Javascript Word Processor.

About Syncfusion

Founded in 2001 and headquartered in Research Triangle Park, N.C., Syncfusion has more than 27,000 customers and more than 1 million users, including large financial institutions, Fortune 500 companies, and global IT consultancies.

Today we provide 1700+ controls and frameworks for web (Blazor, ASP.NET Core, ASP.NET MVC, ASP.NET Web Forms, JavaScript, Angular, React, Vue, and Flutter), mobile (Xamarin, Flutter, UWP, JavaScript, and MAUI (Preview)), and desktop development (Windows Forms, WPF, WinUI, and UWP, Flutter, and MAUI (Preview)). We provide ready-to-deploy enterprise software for dashboards, reports, data integration, and big data processing. Many customers have saved millions in licensing fees by deploying our software.

sales@syncfusion.com | Toll Free: 1-888-9 DOTNET