Перейти к основному содержимому

reorder_grid_columns

Description

Позволяет упорядочивать столбцы сетки методом перетаскивания

reorder_grid_columns: boolean

Example

gantt.config.reorder_grid_columns = true;
gantt.init("gantt_here");

Default value: false

Details

Эта функциональность работает как в grid, так и в resource view.

У свойства есть два CSS-класса:

  • .gantt_column_drag_marker - CSS-класс маркера, который задаёт позицию, в которую будет помещён перетаскиваемый столбец
  • .gantt_grid_head_cell_dragged - CSS-класс перетаскиваемого столбца

События

Вы можете управлять поведением столбцов grid во время перетаскивания через внутренние события сетки: onBeforeColumnDragStart, onAfterColumnReorder, и onColumnDragMove. Например:

пример "onBeforeColumnDragStart"/"onColumnDragMove":

gantt.attachEvent("onGanttReady", function(){
var grid = gantt.$ui.getView("grid");
grid.attachEvent("onBeforeColumnDragStart", function(column, index){
// custom code
return true; // return false to cancel dragging a column
});
grid.attachEvent("onColumnDragMove",function(
dragColumn, targetColumn, dragIndex, targetIndex){
// custom code
return true; //return false to cancel reordering to this position
});
});

пример "onBeforeColumnDragStart"/"onAfterColumnReorder":

gantt.attachEvent("onGanttReady", function(){
var grid = gantt.$ui.getView("grid");
grid.attachEvent("onBeforeColumnDragStart", function(column, index){
if(column.draggedColumn.name == "text"){
return false;
}
return true;
});
grid.attachEvent("onAfterColumnReorder", function(object){
// get the config of a column after reordering
console.log(object)
});
});
Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.