Example of Column Reorder in Javascript Gantt Chart

/
/
Reorder

This sample demonstrates column reordering in the Gantt Chart. Reorder columns either by dragging column headers to a new position or by selecting a column and target index from the property panel.

More Details...

Column
Column Position
Description

This example demonstrates the column reordering feature in the Gantt Chart. Column reordering can be enabled by setting the allowReordering property to true. Columns can be reordered by dragging a column header and dropping it at the desired position within the TreeGrid area. Visual indicators are displayed to show the target drop location during the reordering operation. In this sample, columns can also be reordered programmatically using the property panel by selecting a column and its destination index. In this demo, you can either reorder columns by dragging and dropping or by selecting column name and column index from dropdown to reorder the columns. Injecting Module: Gantt features are segregated into individual feature-wise modules. To use reordering feature, inject the Reorder module using Gantt.Inject(Reorder) method. More information on the Essential® JS2 Gantt Chart can be found in this column reordering documentation section. Looking for the full JavaScript Gantt Chart component overview, features, pricing, and documentation? Visit the JavaScript Gantt Chart page.