We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Marking Holidays but not block them In Gantt Javascript es5

Using Javascript es5 Gantt

I want to mark holiday but dont blocked

How May I achieve this requirement?

Currently Public Holidays are marked but Want to include in working days



5 Replies

GM Gopinath Munusamy Syncfusion Team December 21, 2022 07:05 AM UTC

Hi Ankur,

To include holidays as working days in Gantt chart, you can use the "taskMode" property. This property allows you to specify the scheduling mode of a task, which determines whether the start and end dates of the task will be automatically validated based on factors such as dependencies between tasks, holidays, weekends, and working time. By setting the "taskMode" property to "Manual", you can disable this automatic validation and render all tasks in the project as manually scheduled tasks. The attached code snippets and sample demonstrate how to use the "taskMode" property and include holidays as working days. You can also refer to the provided documentation and online demo for more information.

Code Snippets:


        taskMode :'Manual',

        holidays: [{

                from: new Date('03/01/2017'),

                to: new Date('03/01/2017'),

                label: 'Local Holiday'},



Sample: https://stackblitz.com/edit/zgjz2s?file=index.js

UG Documentation: https://ej2.syncfusion.com/javascript/documentation/gantt/task-scheduling/#manually-scheduled-tasks

Online Demo: https://ej2.syncfusion.com/javascript/demos/#/bootstrap5/gantt/taskMode.html


Gopinath M

AG Ankur Gathia December 23, 2022 05:55 AM UTC

Hello  Gopinath Munusamy,

Its working thanks for your support.

AG Ankur Gathia December 23, 2022 06:12 AM UTC


using task mode , parent items not auto validated while changing child start/end date 

In attached screenshot I have changed start date but parent start date displaying old.


AG Ankur Gathia December 23, 2022 11:45 AM UTC

When I set Task mode Custom and Set parent items isManual true and child data  isManual  as false Then Its working but having one issue

Issue: parent items not set, Its showing wrong duration days as public holidays are not included

If We doesn't Set Task Mode as Custom and use manual , then  items Start/End date not set automatically

GM Gopinath Munusamy Syncfusion Team December 27, 2022 11:43 AM UTC

Ankur, You can be able to update the parent’s Start Date in the column using the queryCellInfo event. In this sample, we have used the queryCellInfo event and update the cell value based on a contion as column.field as StartDate and data.hasChildRecoprds as true. For your reference, a sample and code snippets are attached. Check this below sample and code snippets for more details.

Code Snippets:


queryCellInfo(args) {

    if (args.column.field == 'StartDate' && args.data.hasChildRecords) {

      var gantt = document.getElementsByClassName('e-gantt')[0].ej2_instances[0];

      args.cell.textContent = gantt.getFormatedDate(args.data.ganttProperties.autoStartDate);



Sample: https://stackblitz.com/edit/zgjz2s-jmwqpr?file=index.js

UG Documentation: https://ej2.syncfusion.com/documentation/api/gantt#querycellinfo

Live Chat Icon For mobile
Up arrow icon