dhtmlxGantt 2.0 (development version)

Hello Inga,

According to this thread :


We should be able with the new version to exclude week-ends in project times and task durations. I didn’t see this very wanted feature in this beta version.

It is normal ?


Calling “onBeforeLightbox” stops display of lightbox.

I just want to do some validations on double click before lightbox display.

Is this a bug or is it part of the functionality?

I love this product except I need to show hours , minutes instead of days. Does this new version has time scale feature allow the use of activities that are smaller than one day?

Really great product! Have been able to solve all my problem except not being able to edit or delete links(connectors).

Tooltip and quick info does not work with this new release. It’s looking for ext/quick_info.js and tooltip.js and both are missing from the build. Could you please send me those?


Is there a way to get the file referenced in samples/common/connector.php within the samples as:

include ('../../../connector-php/codebase/gantt_connector.php');

It should provide the JSONGanttConnector object, but appears to be included neither in this ackage nor in the dhtmlxConnector package (PHP Version) …


Would like to add different colors to different levels. Does anybody have any clue how to do that?

Also would appreciate it if somebody can tell me how to edit the links(connectors).

I believe time should be incorporated in the Gantt Chart on the scale. Not just Month, day, and year. Tasks do not start at exactly 00:00:00.

Time should be incorporated in the est and startdate as well.

Inga, You mentioned that it allows you to show time (hours, minutes) but my question was will the ‘startdate’ and ‘est’ accept date and TIME on the new version? I tried the development version but the chart always pushes back to 00:00:00 time each time i save my changes. There still has more to be done to this component looking forward to all the fixes.

All the best,


Rocky, the new dhtmlxGantt allows you to show time (hours, minutes). The horizontal time scale >is customizable.
Also, there is no PRO version of dhtmlxGantt. It’s available in the Standard Edition only so there is >no additional PRO features.
Please post your further technical questions to the forum.

Hi sagnik ,

Returning ‘false’ value from “onBeforeLightbox” handler cancels default action. If you do not specify return, method returns ‘undefined’ which is handled as false.
Following handler won’t block opening the lightbox. This is true for most of events named ‘onBeforeSomething’ [code]gantt.attachEvent(“onBeforeLightbox”, function(id){

return true;

gantt 2.0 allows usage of different units(minutes, hours, days, weeks, months and years), check the examples in /samples/03_scales folder of the package

we’ve added onclick and on doubleclick handling to the links(can be catched with onLinkClick and onLinkDblClick events)
By default links can be only deleted, it happening on double click

sorry for the inconvenience, fixed in the updated package

you can use special template function to add custom css class to task DOM object. Item level is stored in task.$level property:
js: gantt.templates.task_class = function(st,end,item){ return item.$level==0?"custom_css":""; };

gantt_task_line.custom_css { background-color: #65c16f; border: 1px solid #3c9445; }

Check the attachment for the latest dev version
dhtmlxgantt_130830.zip (245 KB)

Tasks can be filtered using “onBeforeTaskDisplay” event, it is called before data rendering for each task, returing false will prevent task dislpayinggantt.attachEvent("onBeforeTaskDisplay", function(id, task){ return true/false; });

onAfterLinkUpdate - currently it’s not fired by user actions, since link can’t be modified from UI, only added and deleted. It’s only triggered if you modify link with gantt.updateLink
onAfterLinkDelete - happens when you delete the link(currently it’s happening on double click).
One more thing about links actions. Default double click behavior(deleting link) can be canceled by returning false from onLinkDblClick handler. So you can replace it with a custom behavior, e.g. opening link details popup: gantt.attachEvent("onLinkDblClick", function(id){ var link = this.getLink(id), src = this.getTask(link.source), trg = this.getTask(link.target); dhtmlx.alert(src.text + "-->" + trg.text); return false; });
Type of the link can be inspected with code like following: var types = gantt.config.links; switch (link.type){ case types.finish_to_start: break; case types.start_to_start: break; case types.finish_to_finish: break; }
You may also check this example

Dragging existing links is currently not possible and most probably won’t be included into upcoming release

Is there any way to serialize the data just like the old version [gantt.getXML()]?


I would like to know if there is a way to increase the size of the first column ?



Size of columns
docs.dhtmlx.com/gantt/desktop__s … sofcolumns

Total width of the columns seem fixed.

So if I extend the size of task name column, part of another column gets covered.

Giving width to all the columns results in them adjusting among themselves in the given space without actually increasing the total width.

Hence, what happens is that the more number of columns I add, the smaller the individual column sizes become resulting in words/numbers/dates in the columns not getting fully displayed.

Is there a solution to this?

Hi Aliaksandr,

I implemented the custom css class for coloring the tasks. However, the completed part is still coming in blue. Please give a solution.


Editing the columns in the newest version results in the plus icon (+) vanishing. This is a major issue for me. Do I have to make any particular changes in my code to display the icon??

Hi sagnik,

progress bar has .gantt_task_progress css class, so you may modify it with following css:

gantt_task_line.custom_css .gantt_task_progress{ background-color: #65c16f; }

Width of the grid is defined by gantt.config.grid_width setting gantt.config.grid_width = 470;

‘Plus’ column now must be added explicitly:

gantt.config.columns=[ ..., {name: "add", width:"50"} ];


Thank you, this works fine. You do a great job.