Особенности использования экземпляра Gantt

В этой статье описаны ключевые аспекты работы с экземпляром Gantt.

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

Следующий метод подходит для приложений на базе Angular или React и доступен в коммерческой, корпоративной или полной версиях dhtmlxGantt (не поддерживается в GPL или индивидуальных редакциях):

  • При открытии страницы, вкладки или представления с Gantt необходимо создать новый экземпляр Gantt.
  • Для переключения на другую страницу, вкладку или представление требуется уничтожить экземпляр Gantt.

Альтернативный метод (совместимый со всеми версиями) включает ручной сброс всех настроек.

Обратите внимание на пример, показывающий, как этот метод может быть реализован.
Нажатие кнопки Recreate Gantt инициализирует Gantt, загружает задачи и прикрепляет события. Уничтожение Gantt отсоединяет события.

Ниже приведен список важных моментов при использовании этого метода:

Пользовательские события

При загрузке страницы с Gantt необходимо сохранить идентификаторы событий в массиве перед их добавлением:

const onTaskClick = gantt.attachEvent('onTaskClick', (id) => {
    gantt.message(`onTaskClick: Task ID: ${id}`);
    return true;
}, '');
eventIDs.push(onTaskClick);

Переключение на другую страницу требует ручного отсоединения событий, используя сохраненные идентификаторы в массиве:

eventIDs.forEach(event => gantt.detachEvent(event));
eventIDs = [];

Для получения дополнительной информации обратитесь к разделу Отсоединение событий.

Data Processor

DataProcessor должен быть уничтожен вручную:

dp.destructor();

Имейте в виду, что уничтожать следует только dataProcessor. Уничтожение самого Gantt не позволит использовать его снова, пока страница не будет перезагружена.

Задачи, ссылки, данные ресурсов, маркеры, пользовательские горячие клавиши

Эти элементы можно безопасно удалить из экземпляра Gantt с помощью метода clearAll().

Конфигурация Gantt

Встроенной функции для сохранения или сброса конфигурации Gantt до ее состояния по умолчанию не существует. Большинство настроек хранятся в объекте gantt.config.

CSS

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

Настройки календаря

Настройки календаря могут быть удалены вручную с помощью метода gantt.deleteCalendar().

Другие случаи

В дополнение к вышеупомянутым пунктам могут быть и другие сценарии, которые нужно обработать, хотя не все возможные случаи были протестированы с этим подходом.

К началу