Index in Vue Treegrid component
16 Mar 20231 minute to read
WCF services or
DataManager and binding data fields to columns. It also expands or collapses child data using the tree column.
The most important features available in the TreeGrid component are paging, sorting, filtering and searching.
- Sorting: Supports n levels of sorting.
- Filtering: Supports filtering records with filter bar and menu filtering modes.
- Paging: Allows easy switching between pages using the pager bar.
- Editing: Offers cell and row editing modes for updating the records.
- Columns: The column definitions are used as the datasource schema in the TreeGrid. This plays a vital role in rendering column values in the required tree structure.
- Reordering: Allows dragging and dropping of any column anywhere in the TreeGrid’s column header row, thus allowing repositioning of columns.
- Resizing: Resizing allows changing column width on the fly by simply dragging the right corner of the column header.
- Cell Styling: TreeGrid cell styles can be customized either by using CSS or programmatically.
- Selection: Rows or cells can be selected in the TreeGrid. One or more rows or cells can also be selected by holding Ctrl or Command, or programmatically.
- Templates: Templates can be used to create custom user experiences in the TreeGrid.
- Aggregation: Provides the option to easily visualized the aggregates for column values. Displays aggregate for child data.
- Context menu: The context menu provides a list of actions to be performed in the TreeGrid. It appears when a cell, header, or the pager is right-clicked.
- Export: Provides the options to Export the TreeGrid data to Excel, PDF, and CSV formats.
- RTL support: Provides right-to-left mode that aligns the TreeGrid content from right to left.
- Localization: Provides an inherent support to localize the UI.