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
Version:
19.3.43
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:
[index.js] 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
Regards,
Gopinath M
Hello Gopinath Munusamy,
Its working thanks for your support.
Hello,
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.
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
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:
[index.js] 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