Migration from Older Versions

6.0 -> 6.1

Time constraints and auto scheduling

The dhtmlxgantt_auto_scheduling.js extension is upgraded with the tasks constraints functionality. Since this feature modifies the default behavior of auto scheduling, Gantt supports the compatibility mode that allows you to restore the previous behavior and not to take into account tasks constraints during auto scheduling.

To enter the compatibility mode, make use of the following configuration option:

gantt.config.auto_scheduling_compatibility = true;

Tooltips displaying area

Before version 6.1 tooltips have been displayed only inside the timeline area. After v6.1 release tooltips displaying isn't limited, and a tooltip follows the movement of the mouse pointer.

If necessary, you can restore the previous behavior by using the code below before initialization of Gantt:

gantt.attachEvent("onGanttReady", function(){
    var tooltips = gantt.ext.tooltips;

5.2 -> 6.0

In the version 6.0 the getSlack() method is deprecated. Two methods are added instead:

Methods marked as deprecated in v4.0 stopped working in v6.0. The dhtmlx object definition was removed from dhtmlxgantt.js.

If you use any of the obsolete methods, you'll need to replace them with supported implementations according to the table below. No changes in the arguments or behavior of the methods were made.

Obsolete methodsWorking methods

3.x -> 4.0

Version 4.0 introduces some changes in public API, namely:

  • legacy modules as well as the modules that intersect with dhtmlxSuite modules are no longer defined by the dhtmlxGantt library
  • commonly used modules, such as dhtmlxMessage, dataProcessor, Ajax are moved to the window.gantt namespace and became a part of dhtmlxGantt public API

A fallback to the old API is included in v4.x, so the code written for v3.3 and earlier will continue working. However in some cases changes are required. Generally, all global declarations, except for window.gantt and window.Gantt (enterprise version only) are deprecated and will be removed in version 5.0.

Deprecated API

There are methods that have been deprecated. They will continue working in v4.x, but will trigger a console warning (not visible to the end users) each time they are called.


  • dhtmlxMessage module has been moved from the window.dhtmlx object to the window.gantt object. Read more about Message Boxes here
  • dhtmlxDataProcessor constructor has been moved from window.dataProcessor to window.gantt.dataProcessor
  • utility methods such as dhtmlx.copy, dhtmlx.uid and dhtmlx.mixin have been moved to window.gantt object

If you use these methods, your application will continue working after updating to v4.0 without requiring any immediate changes. In future we recommend updating them to a newer version of the API.

The complete list of deprecated methods includes:

Up to version 3.3From version 4.0

Obsolete API

Some methods have become obsolete and will no longer be used in v4.x. If you still use these methods or objects, you'll need either to modify the code of an application or to include the dhtmlxgantt_deprecated.js file to the page.


  • window.dhx4 is no longer defined by dhtmlxgantt.js
  • Environment variables that were defined in window.dhx4 are now available in the gantt.env object
  • Ajax module has been moved from dhx4.ajax to gantt.ajax
  • gantt.event, gantt.eventRemove should be used instead of dhtmlxEvent/dhtmlxDetachEvent

The whole list of the obsolete API is given below:

Up to version 3.3From version 4.0

2.0 -> 3.0

1) In order to prevent CSS conflicts with dhtmlxScheduler, the class names that have been used by both components were renamed in dhtmlxGantt (all classes were related to the lightbox). If you have customized styling for the lightbox, the migration will consist in renaming to appropriate CSS classes.

There is 2 renamed patterns:

  • Replace '.dhx_gantt_' to '.gantt_' (.dhx_gantt_duration -> .gantt_duration)
  • Replace '.dhx_' prefix with '.gantt_' (.dhx_custom_button -> .gantt_custom_button)

If you encounter difficulties with migrating CSS classes,please, see the full list of renamed classes here.

2) The default values of the buttons_right and buttons_left configs were changed in the following way:

gantt.config.buttons_left = [
gantt.config.buttons_right = [
gantt.config.buttons_left = [
gantt.config.buttons_right = [

Old configurations ( "dhx_save_btn", "dhx_cancel_btn", "gantt_delete_btn") will still work. Changes does not break any existing behavior.

3) The following features are now available only in the Commercial or Enterprise version of the component (not available in the GPL version of dhtmlxGantt):

  • Ability to hide days in week, month, timeline view
  • Projects, milestones and other custom types

1.0 -> 2.0

1) A variety of objects (GanttProjectInfo, GanttTaskInfo, GanttChart, GanttProject, GanttTask) are replaced with 1 static object - gantt.
The gantt object contains a set of methods and 2 main properties: config and templates.

  • gantt.config - configuration options for dates, scale, controls etc.
  • gantt.templates - formatting templates for dates and labels used in the Gantt chart.

2) dhtmlxGantt is initialized through the init method
var gantt = new GanttChart() -> gantt.init("gantt_div").

3) Instead of GanttProject and GanttTask, data is stored as an array of plain objects with a number of mandatory properties and any custom properties:

        {id:1, text:"Project #2", start_date:"01-04-2013", duration:18,
    progress:0.4, open: true},
        {id:2, text:"Task #1",    start_date:"02-04-2013", duration:8,
    progress:0.6, parent:1},
        {id:3, text:"Task #2",    start_date:"11-04-2013", duration:8,
    progress:0.6, parent:1}
        { id:1, source:1, target:2, type:"1"},
        { id:2, source:2, target:3, type:"0"},
        { id:3, source:3, target:4, type:"0"},
        { id:4, source:2, target:5, type:"2"},

4) The XML format was changed but the old XML format is still can be loaded.


Related sample:  Loading data in Gantt 1.6 format

5) Design-time Objects:

6) Run-time Objects:

dhtmlxGantt 2.0 doesn't use different types for project and task objects. Instead of this, any task object can have 1 parent object and any number of child tasks.

  • GanttProject
    • Instead of getDuration(), getId(), getName(), getPercentCompleted(), getStartDate(), project properties are accessed through gantt.getTask(projectTaskId).{name_of_property}
  • GanttTask
    • Instead of getDuration(), getId(), getName(), getParentTaskId(), getPercentCompleted(), getPredecessorTaskId(), setDuration(, ) task properties are accessed through gantt.getTask(taskId).{name_of_property}

A list of methods to get parent/child objects:

The id of the parent task can be accessed as gantt.getTask(task_id).parent. The root element doesn't have the 'parent' property.

Back to top