Выбор нескольких задач

Начиная с версии 3.2, библиотека включает расширение multiselect, которое позволяет выбирать несколько задач одновременно.

Активация выбора нескольких задач

Чтобы включить выбор нескольких задач, просто активируйте его с помощью метода gantt.plugins:

<!DOCTYPE html>
<html>
<head>
   <script src="codebase/dhtmlxgantt.js"></script>   
   <link href="codebase/dhtmlxgantt.css" rel="stylesheet">   
</head>
<body>
    gantt.plugins({         multiselect: true     });     //ваш код будет здесь
</body>
</html>

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

Если вам нужно его отключить, вы можете сделать это с помощью опции gantt.config.multiselect:

Отключение выбора нескольких задач

gantt.config.multiselect = false;

Обновление нескольких задач одновременно

Чтобы внести изменения в несколько задач или связей сразу, вы можете использовать метод gantt.batchUpdate:

gantt.batchUpdate(function () {
    var tasks = gantt.getTaskByTime();
    for(var i = 0; i < tasks.length; i++){
        var task = tasks[i];
        task.start_date = gantt.date.add(task.start_date, 1, "day");
        task.end_date = gantt.calculateEndDate(task.start_date, task.duration);
        gantt.updateTask(task.id);
    }
});

Этот метод позволяет обновлять несколько задач или связей одновременно, перерисовывая диаграмму только один раз, что более эффективно, чем обновление каждой задачи по отдельности.

Перебор выбранных задач

Чтобы перебрать все выбранные задачи в диаграмме Ганта, вы можете использовать метод gantt.eachSelectedTask:

gantt.batchUpdate(function () {
    gantt.eachSelectedTask(function(task_id){
        if(gantt.isTaskExists(task_id))
            gantt.deleteTask(task_id);
    });
});

Отступ и выравнивание для нескольких задач

С выбором нескольких задач вы можете выполнять действия, такие как добавление отступа или выравнивание, чтобы преобразовать задачи в подзадачи или вернуть их обратно.

Проверка статуса выбора задачи

Если вы хотите проверить, выбрана ли определенная задача, вы можете использовать метод gantt.isSelectedTask:

gantt.templates.task_class = 
gantt.templates.grid_row_class = 
gantt.templates.task_row_class = function (start, end, task) {
    if (gantt.isSelectedTask(task.id))
        return "gantt_selected";
};

Чтобы переключить состояние выбора задачи, вы можете использовать метод gantt.toggleTaskSelection:

gantt.toggleTaskSelection("t_1"); //"t_1" это id задачи
gantt.render();

Получение выбранных задач

Чтобы получить все текущие выбранные задачи, вы можете использовать метод gantt.getSelectedTasks:

gantt.getSelectedTasks();

Если вам нужна только последняя выбранная задача, доступен метод gantt.getLastSelectedTask:

gantt.getLastSelectedTask();

Ограничение выбора нескольких задач одним уровнем

Если вы хотите ограничить выбор задачами в пределах одного уровня, вы можете включить опцию gantt.config.multiselect_one_level:

gantt.config.multiselect_one_level = true; 
gantt.init('gantt_here');

Выбор нескольких задач и перетаскивание

Когда активировано расширение multiselect.js, вы можете выбрать несколько задач, удерживая Ctrl или Shift, а затем перетащить их горизонтально как группу.

Если вы предпочитаете отключить это, вы можете установить опцию gantt.config.drag_multiple в false:

gantt.config.drag_multiple = true;

Открытие редактора одним кликом

В режиме одиночного выбора, клик по задаче откроет встроенный редактор.

В режиме мультивыбора, клик по невыбранной задаче сначала выберет её. Встроенный редактор откроется только после второго клика. Если вы хотите, чтобы редактор открывался с первого клика, включите опцию gantt.config.inline_editors_multiselect_open.

gantt.plugins({
  multiselect: true
});
 
...
 
gantt.config.inline_editors_multiselect_open = true;

События API

Когда активирован выбор нескольких задач, выбор или отмена выбора задач вызывает как общие события gantt.onTaskSelected / gantt.onTaskUnselected, так и события, специфичные для расширения multiselect.

Вот последовательность событий для выбора нескольких задач:

gantt.onBeforeMultiSelect - срабатывает перед выбором задачи или диапазона задач и может быть заблокировано
gantt.onBeforeTaskMultiSelect - срабатывает перед изменением состояния выбора задачи (выбором или отменой выбора) и может быть заблокировано
gantt.onTaskMultiSelect - срабатывает после изменения состояния выбора задачи (выбрана или снята)
gantt.onTaskUnselected - вызывается для каждой задачи в диапазоне мультивыбора
gantt.onTaskSelected - вызывается для каждой задачи в диапазоне мультивыбора
gantt.onMultiSelect - срабатывает после завершения выбора задачи или диапазона задач

К началу