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

reorder_grid_columns

Description​

Позволяет изменять порядок колонок в grid с помощью drag and drop

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 - отмечает позицию, куда будет помещена перетаскиваемая колонка
  • .gantt_grid_head_cell_dragged - применяется к колонке, которая в данный момент перетаскивается

События​

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

gantt.attachEvent("onGanttReady", function(){
      var grid = gantt.$ui.getView("grid");
      grid.attachEvent("onBeforeColumnDragStart", function(column, index){
        // пользовательский код
        return true; // вернуть false, чтобы запретить перетаскивание этой колонки
      });
      grid.attachEvent("onColumnDragMove",function(
          dragColumn, targetColumn, dragIndex, targetIndex){
        // пользовательский код
        return true; // вернуть false, чтобы заблокировать изменение порядка в эту позицию
      });
});

и

snippet "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){
        // доступ к конфигурации колонок после изменения порядка
        console.log(object)
      });
});