Task Scheduling
3 Jan 202424 minutes to read
The Gantt provides support for automatic and manual task scheduling modes. It is used to indicate whether the start date and end date of all the tasks will be automatically validated or not. taskMode is the property used to change the schedule mode of a task.
The Gantt control supports three types of mode. They are:
-
Auto: All the tasks are automatically validate. -
Manual: All the tasks are manually validate by the user. -
Custom: Both Auto and Manual tasks are render by mapped from data source.
NOTE
The default value of
taskModeisAuto.
Automatically scheduled tasks
When the taskMode property is set as Auto, the start date and end date of all the tasks in the project will be automatically validated. That is, dates are validated based on various factors such as working time, holidays, weekends and predecessors.
@(Html.EJS().Gantt("ResourceAllocation").DataSource((IEnumerable<object>
)ViewBag.DataSource).Height("450px").HighlightWeekends(true).AllowSelection(true)
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress")
.Dependency("Predecessor").Child("SubTasks"))
.TreeColumnIndex(1).TaskMode(Syncfusion.EJ2.Gantt.ScheduleMode.Auto)
.EditSettings(es => es.AllowEditing(true).AllowDeleting(true).AllowTaskbarEditing(true).ShowDeleteConfirmDialog(true))
.Toolbar(new List<string>
() { "Add", "Edit", "Update", "Delete", "Cancel", "ExpandAll", "CollapseAll" })
.Render()
)using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = TaskModeData();
return View();
}
public static List<GanttDataSource> TaskModeData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Parent Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record1Child1 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40
};
GanttDataSource Record1Child2 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 02, 26),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true
};
GanttDataSource Record1Child3 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 27),
Duration = 5,
Progress = 40,
EndDate = new DateTime(2017, 03, 03)
};
Record1.SubTasks.Add(Record1Child1);
Record1.SubTasks.Add(Record1Child2);
Record1.SubTasks.Add(Record1Child3);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Parent Task 2",
StartDate = new DateTime(2017, 03, 05),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record2Child1 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
};
GanttDataSource Record2Child2 = new GanttDataSource()
{
TaskId = 7,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40
};
GanttDataSource Record2Child3 = new GanttDataSource()
{
TaskId = 8,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 28),
EndDate = new DateTime(2017, 03, 05),
Progress = 40,
IsManual = true
};
GanttDataSource Record2Child4 = new GanttDataSource()
{
TaskId = 9,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 04),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true
};
Record2.SubTasks.Add(Record2Child1);
Record2.SubTasks.Add(Record2Child2);
Record2.SubTasks.Add(Record2Child3);
Record2.SubTasks.Add(Record2Child4);
GanttDataSource Record3 = new GanttDataSource()
{
TaskId = 10,
TaskName = "Parent Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record3Child1 = new GanttDataSource()
{
TaskId = 11,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child2 = new GanttDataSource()
{
TaskId = 12,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child3 = new GanttDataSource()
{
TaskId = 13,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child4 = new GanttDataSource()
{
TaskId = 14,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 12),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true
};
GanttDataSource Record3Child5 = new GanttDataSource()
{
TaskId = 15,
TaskName = "Child Task 5",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
};
Record3.SubTasks.Add(Record3Child1);
Record3.SubTasks.Add(Record3Child2);
Record3.SubTasks.Add(Record3Child3);
Record3.SubTasks.Add(Record3Child4);
Record3.SubTasks.Add(Record3Child5);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
GanttDataSourceCollection.Add(Record3);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
}
}
}
Manually scheduled tasks
When the taskMode property is set as Manual, the start date and end date of all the tasks in the project will be same as given in the data source. That is, dates are not validated based on various factors such as dependencies between tasks, holidays, weekends, working time. We can restrict this mode in predecessor validation alone. That is, we can automatically validate the dates based on predecessor values by enabling the validateManualTasksOnLinking property.
@(Html.EJS().Gantt("ResourceAllocation").DataSource((IEnumerable<object>
)ViewBag.DataSource).Height("450px").HighlightWeekends(true).AllowSelection(true)
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress")
.Dependency("Predecessor").Child("SubTasks"))
.TreeColumnIndex(1).TaskMode(Syncfusion.EJ2.Gantt.ScheduleMode.Manual)
.EditSettings(es => es.AllowEditing(true).AllowDeleting(true).AllowTaskbarEditing(true).ShowDeleteConfirmDialog(true))
.Toolbar(new List<string>
() { "Add", "Edit", "Update", "Delete", "Cancel", "ExpandAll", "CollapseAll" })
.Render()
)using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = TaskModeData();
return View();
}
public static List<GanttDataSource> TaskModeData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Parent Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record1Child1 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40
};
GanttDataSource Record1Child2 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 02, 26),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true
};
GanttDataSource Record1Child3 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 27),
Duration = 5,
Progress = 40,
EndDate = new DateTime(2017, 03, 03)
};
Record1.SubTasks.Add(Record1Child1);
Record1.SubTasks.Add(Record1Child2);
Record1.SubTasks.Add(Record1Child3);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Parent Task 2",
StartDate = new DateTime(2017, 03, 05),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record2Child1 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
};
GanttDataSource Record2Child2 = new GanttDataSource()
{
TaskId = 7,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40
};
GanttDataSource Record2Child3 = new GanttDataSource()
{
TaskId = 8,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 28),
EndDate = new DateTime(2017, 03, 05),
Progress = 40,
IsManual = true
};
GanttDataSource Record2Child4 = new GanttDataSource()
{
TaskId = 9,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 04),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true
};
Record2.SubTasks.Add(Record2Child1);
Record2.SubTasks.Add(Record2Child2);
Record2.SubTasks.Add(Record2Child3);
Record2.SubTasks.Add(Record2Child4);
GanttDataSource Record3 = new GanttDataSource()
{
TaskId = 10,
TaskName = "Parent Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record3Child1 = new GanttDataSource()
{
TaskId = 11,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child2 = new GanttDataSource()
{
TaskId = 12,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child3 = new GanttDataSource()
{
TaskId = 13,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child4 = new GanttDataSource()
{
TaskId = 14,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 12),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true
};
GanttDataSource Record3Child5 = new GanttDataSource()
{
TaskId = 15,
TaskName = "Child Task 5",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
};
Record3.SubTasks.Add(Record3Child1);
Record3.SubTasks.Add(Record3Child2);
Record3.SubTasks.Add(Record3Child3);
Record3.SubTasks.Add(Record3Child4);
Record3.SubTasks.Add(Record3Child5);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
GanttDataSourceCollection.Add(Record3);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
}
}
}
Custom
When the taskMode property is set as Custom, the scheduling mode for each tasks will be mapped from the data source field. The Boolean property taskFields.manual is used to map the manual scheduling mode field from the data source.
@(Html.EJS().Gantt("ResourceAllocation").DataSource((IEnumerable<object>
)ViewBag.DataSource).Height("450px").HighlightWeekends(true).AllowSelection(true)
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress")
.Dependency("Predecessor").Manual("IsManual").Child("SubTasks"))
.TreeColumnIndex(1).TaskMode(Syncfusion.EJ2.Gantt.ScheduleMode.Custom)
.EditSettings(es => es.AllowEditing(true).AllowDeleting(true).AllowTaskbarEditing(true).ShowDeleteConfirmDialog(true))
.Toolbar(new List<string>
() { "Add", "Edit", "Update", "Delete", "Cancel", "ExpandAll", "CollapseAll" })
.Columns(col =>
{
col.Field("TaskId").Visible(false).Add();
col.Field("TaskName").HeaderText("Task Name").Add();
col.Field("IsManual").Add();
})
.Render()
)using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = TaskModeData();
return View();
}
public static List<GanttDataSource> TaskModeData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Parent Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record1Child1 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 02, 27),
EndDate = new DateTime(2017, 03, 03),
Progress = 40
};
GanttDataSource Record1Child2 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 02, 26),
EndDate = new DateTime(2017, 03, 03),
Progress = 40,
IsManual = true
};
GanttDataSource Record1Child3 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 27),
Duration = 5,
Progress = 40,
EndDate = new DateTime(2017, 03, 03)
};
Record1.SubTasks.Add(Record1Child1);
Record1.SubTasks.Add(Record1Child2);
Record1.SubTasks.Add(Record1Child3);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Parent Task 2",
StartDate = new DateTime(2017, 03, 05),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record2Child1 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
};
GanttDataSource Record2Child2 = new GanttDataSource()
{
TaskId = 7,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 06),
EndDate = new DateTime(2017, 03, 09),
Progress = 40
};
GanttDataSource Record2Child3 = new GanttDataSource()
{
TaskId = 8,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 02, 28),
EndDate = new DateTime(2017, 03, 05),
Progress = 40,
IsManual = true
};
GanttDataSource Record2Child4 = new GanttDataSource()
{
TaskId = 9,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 04),
EndDate = new DateTime(2017, 03, 09),
Progress = 40,
IsManual = true
};
Record2.SubTasks.Add(Record2Child1);
Record2.SubTasks.Add(Record2Child2);
Record2.SubTasks.Add(Record2Child3);
Record2.SubTasks.Add(Record2Child4);
GanttDataSource Record3 = new GanttDataSource()
{
TaskId = 10,
TaskName = "Parent Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true,
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record3Child1 = new GanttDataSource()
{
TaskId = 11,
TaskName = "Child Task 1",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child2 = new GanttDataSource()
{
TaskId = 12,
TaskName = "Child Task 2",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child3 = new GanttDataSource()
{
TaskId = 13,
TaskName = "Child Task 3",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40
};
GanttDataSource Record3Child4 = new GanttDataSource()
{
TaskId = 14,
TaskName = "Child Task 4",
StartDate = new DateTime(2017, 03, 12),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
IsManual = true
};
GanttDataSource Record3Child5 = new GanttDataSource()
{
TaskId = 15,
TaskName = "Child Task 5",
StartDate = new DateTime(2017, 03, 13),
EndDate = new DateTime(2017, 03, 17),
Progress = 40,
};
Record3.SubTasks.Add(Record3Child1);
Record3.SubTasks.Add(Record3Child2);
Record3.SubTasks.Add(Record3Child3);
Record3.SubTasks.Add(Record3Child4);
Record3.SubTasks.Add(Record3Child5);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
GanttDataSourceCollection.Add(Record3);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
}
}
}
Unscheduled tasks
Unscheduled tasks are planned for a project without any definite schedule dates. The Gantt control supports rendering the unscheduled tasks. You can create or update the tasks with anyone of start date, end date, and duration values or none. You can enable or disable the unscheduled tasks by using the allowUnscheduledTasks property. The following images represent the various types of unscheduled tasks in Gantt.
| Taskbar state | Auto | Manual |
|---|---|---|
Start Date Only |
 |
 |
End Date Only |
 |
 |
Duration Only |
 |
 |
Milestone |
 |
|
NOTE
A milestone is a task that has no start and end dates, but it has a duration value of zero.
Define unscheduled tasks in data source
You can define the various types of unscheduled tasks in the data source as follows
@(Html.EJS().Gantt("UnscehduledTask").DataSource((IEnumerable<object>)ViewBag.DataSource)
.Height("450px")
.HighlightWeekends(true)
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress"))
.EditSettings(es => es.AllowEditing(true).AllowTaskbarEditing(true))
.AllowUnscheduledTasks(true)
.Render()
)
</div>using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = UnscheduledData();
return View();
}
public static List<GanttDataSource> UnscheduledData()
{
List<GanttDataSource> ganttData = new List<GanttDataSource>();
GanttDataSource record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Task 1",
StartDate = new DateTime(2019, 01, 03),
EndDate = new DateTime(2019, 01, 08),
Duration = 5,
TaskType = "",
};
GanttDataSource record2 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Task 2",
Duration = 5,
TaskType = "Task with duration only",
};
GanttDataSource record3 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Task 3",
StartDate = new DateTime(2019, 01, 03),
TaskType = "Task with start date only",
};
GanttDataSource record4 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Task 4",
EndDate = new DateTime(2019, 01, 08),
TaskType = "Task with end date only",
};
ganttData.Add(record1);
ganttData.Add(record2);
ganttData.Add(record3);
ganttData.Add(record4);
return ganttData;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
}
}
}
NOTE
If the
allowUnscheduledTasksproperty is set to false, then the Gantt control automatically calculates the scheduled date values with a default value of duration 1 and the project start date is considered as the start date for the task.
Working time range
In the Gantt control, working hours in a day for a project can be defined by using the dayWorkingTime property. Based on the working hours, automatic date scheduling and duration validations for a task are performed.
The following code snippet explains how to define the working time range for the project in Gantt.
<div class="col-lg-9 control-section">
<div class="content-wrapper">
@(Html.EJS().Gantt("WorkingTimeRange").DataSource((IEnumerable<object>)ViewBag.DataSource).Height("450px")
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").Duration("Duration").Progress("Progress").Child("SubTasks"))
.TimelineSettings(ts => ts.TopTier(tt => tt.Unit(Syncfusion.EJ2.Gantt.TimelineViewMode.Day)).BottomTier(bt => bt.Unit(Syncfusion.EJ2.Gantt.TimelineViewMode.Hour)))
.Render()
)
</div>
</div>
<div class="col-lg-3 property-section">
<table id="property" title="Properties" style="width: 100%;">
<colgroup>
<col style="width:55%" />
<col style="width:45%" />
</colgroup>
<tr>
<td style="width:55%">
<div>Work Start Time</div>
</td>
<td style="width:45%">
<div style="padding-top: 0px">
@(Html.EJS().NumericTextBox("WorkStartTime").Min(0).Max(24).Value(8).Change("UpdateTime").ShowSpinButton(true).Step(0.5)
.Render()
)
</div>
</td>
</tr>
<tr>
<td style="width:55%">
<div>Work End Time</div>
</td>
<td style="width:45%">
<div style="padding-top: 0px">
@(Html.EJS().NumericTextBox("WorkEndTime").Min(0).Max(24).Value(17).Change("UpdateTime").ShowSpinButton(true).Step(0.5)
.Render()
)
</div>
</td>
</tr>
</table>
</div>
<script>
var isTimeUpdated = false;
function UpdateTime() {
var ganttChart = document.getElementById("WorkingTimeRange").ej2_instances[0];
var defaultDate = "08/08/2016", startDate = new Date(defaultDate), endDate = new Date(defaultDate);
var decPlace = WorkStartTime.value - Math.floor(WorkStartTime.value);
startDate.setHours(WorkStartTime.value);
startDate.setMinutes(decPlace * 60);
decPlace = WorkEndTime.value - Math.floor(WorkEndTime.value);
endDate.setHours(WorkEndTime.value);
endDate.setMinutes(decPlace * 60);
/*Validate time value and update the time range*/
if (startDate.getTime() < endDate.getTime() && isTimeUpdated == false) {
var workingTime = [{ from: WorkStartTime.value, to: WorkEndTime.value }];
ganttChart.dayWorkingTime = workingTime;
isTimeUpdated = false;
}
else {
isTimeUpdated = true;
WorkStartTime.value = ganttChart.dayWorkingTime[0].from;
WorkEndTime.value = ganttChart.dayWorkingTime[ganttChart.dayWorkingTime.length - 1].to;
}
isTimeUpdated = false;
}
</script>
}using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = ProjectNewData();
return View();
}
public static List<GanttDataSource> ProjectNewData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
List<IndicatorsModel> Indicators = new List<IndicatorsModel>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Product concept",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Child11 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Defining the product and its usage",
StartDate = new DateTime(2019, 04, 02),
Progress = 30,
Duration = 3,
};
GanttDataSource Child12 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Defining target audience",
StartDate = new DateTime(2019, 04, 02),
Duration = 3,
};
GanttDataSource Child13 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Prepare product sketch and notes",
StartDate = new DateTime(2019, 04, 02),
Progress = 30,
Duration = 2,
Predecessor = "2"
};
Record1.SubTasks.Add(Child11);
Record1.SubTasks.Add(Child12);
Record1.SubTasks.Add(Child13);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Concept approval",
StartDate = new DateTime(2019, 04, 02),
Duration = 0,
Predecessor = "3, 4",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "04/10/2019", name= "Design Phase", tooltip="Design phase completed", iconClass="okIcon e-icons" }
}
};
GanttDataSource Record3 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Market research",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record6Child1 = new GanttDataSource()
{
TaskId = 7,
TaskName = "Demand analysis",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record7Child1 = new GanttDataSource()
{
TaskId = 8,
TaskName = "Customer strength",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "5",
Progress = 30
};
GanttDataSource Record7Child2 = new GanttDataSource()
{
TaskId = 9,
TaskName = "Market opportunity analysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "5",
};
Record6Child1.SubTasks.Add(Record7Child1);
Record6Child1.SubTasks.Add(Record7Child2);
GanttDataSource Record6Child2 = new GanttDataSource()
{
TaskId = 10,
TaskName = "Competitor analysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "7, 8",
Progress = 30,
};
GanttDataSource Record6Child3 = new GanttDataSource()
{
TaskId = 11,
TaskName = "Product strength analsysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "9",
};
GanttDataSource Record6Child4 = new GanttDataSource()
{
TaskId = 12,
TaskName = "Research complete",
StartDate = new DateTime(2019, 04, 04),
Duration = 0,
Predecessor = "10",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "04/20/2019", name= "Research completed", tooltip="Research completed", iconClass="description e-icons" }
}
};
Record3.SubTasks.Add(Record6Child1);
Record3.SubTasks.Add(Record6Child2);
Record3.SubTasks.Add(Record6Child3);
Record3.SubTasks.Add(Record6Child4);
GanttDataSource Record4 = new GanttDataSource()
{
TaskId = 13,
TaskName = "Product design and development",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record13Child1 = new GanttDataSource()
{
TaskId = 14,
TaskName = "Functionality design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 30,
Predecessor = "12"
};
GanttDataSource Record13Child2 = new GanttDataSource()
{
TaskId = 15,
TaskName = "Quality design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "12"
};
GanttDataSource Record13Child3 = new GanttDataSource()
{
TaskId = 16,
TaskName = "Define reliability",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Progress = 30,
Predecessor = "15"
};
GanttDataSource Record13Child4 = new GanttDataSource()
{
TaskId = 17,
TaskName = "Identifying raw materials",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "15"
};
GanttDataSource Record13Child5 = new GanttDataSource()
{
TaskId = 18,
TaskName = "Define cost plan",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record18Child1 = new GanttDataSource()
{
TaskId = 19,
TaskName = "Manufacturing cost",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "17",
Progress = 30
};
GanttDataSource Record18Child2 = new GanttDataSource()
{
TaskId = 20,
TaskName = "Selling cost",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "17",
};
Record13Child5.SubTasks.Add(Record18Child1);
Record13Child5.SubTasks.Add(Record18Child2);
GanttDataSource Record13Child6 = new GanttDataSource()
{
TaskId = 21,
TaskName = "Development of the final design",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record21Child1 = new GanttDataSource()
{
TaskId = 22,
TaskName = "Defining dimensions and package volume",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "19, 20",
Progress = 30
};
GanttDataSource Record21Child2 = new GanttDataSource()
{
TaskId = 23,
TaskName = "Develop design to meet industry standards",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "22",
};
GanttDataSource Record21Child3 = new GanttDataSource()
{
TaskId = 24,
TaskName = "Include all the details",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "23",
};
Record13Child6.SubTasks.Add(Record21Child1);
Record13Child6.SubTasks.Add(Record21Child2);
Record13Child6.SubTasks.Add(Record21Child3);
GanttDataSource Record13Child7 = new GanttDataSource()
{
TaskId = 25,
TaskName = "CAD Computer-aided design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 30,
Predecessor = "24"
};
GanttDataSource Record13Child8 = new GanttDataSource()
{
TaskId = 26,
TaskName = "CAM Computer-aided manufacturing",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "25"
};
GanttDataSource Record13Child9 = new GanttDataSource()
{
TaskId = 27,
TaskName = "Design complete",
StartDate = new DateTime(2019, 04, 04),
Duration = 0,
Predecessor = "26",
};
GanttDataSource Record5 = new GanttDataSource()
{
TaskId = 28,
TaskName = "Prototype testing",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "27"
};
GanttDataSource Record6 = new GanttDataSource()
{
TaskId = 29,
TaskName = "Include feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "28ss",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "05/24/2019", name= "Production phase", tooltip="Production phase completed", iconClass="okIcon e-icons" }
}
};
GanttDataSource Record7 = new GanttDataSource()
{
TaskId = 30,
TaskName = "Manufacturing",
StartDate = new DateTime(2019, 04, 04),
Duration = 5,
Progress = 30,
Predecessor = "28, 29"
};
GanttDataSource Record8 = new GanttDataSource()
{
TaskId = 31,
TaskName = "Assembling materials to finsihed goods",
StartDate = new DateTime(2019, 04, 04),
Duration = 5,
Predecessor = "30"
};
Record4.SubTasks.Add(Record13Child1);
Record4.SubTasks.Add(Record13Child2);
Record4.SubTasks.Add(Record13Child3);
Record4.SubTasks.Add(Record13Child4);
Record4.SubTasks.Add(Record13Child5);
Record4.SubTasks.Add(Record13Child6);
Record4.SubTasks.Add(Record13Child7);
Record4.SubTasks.Add(Record13Child8);
Record4.SubTasks.Add(Record13Child9);
GanttDataSource Record9 = new GanttDataSource()
{
TaskId = 32,
TaskName = "Feedback and testing",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record9Child1 = new GanttDataSource()
{
TaskId = 33,
TaskName = "Internal testing and feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 45,
Predecessor = "31",
};
GanttDataSource Record9Child2 = new GanttDataSource()
{
TaskId = 34,
TaskName = "Customer testing and feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 50,
Predecessor = "33",
};
Record9.SubTasks.Add(Record9Child1);
Record9.SubTasks.Add(Record9Child2);
GanttDataSource Record10 = new GanttDataSource()
{
TaskId = 35,
TaskName = "Final product development",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record10Child1 = new GanttDataSource()
{
TaskId = 36,
TaskName = "Important improvements",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "34",
};
GanttDataSource Record10Child2 = new GanttDataSource()
{
TaskId = 37,
TaskName = "Address any unforeseen issues",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "36ss",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "06/21/2019", name= "Sales and marketing", tooltip="Sales and marketing", iconClass="description e-icons" }
}
};
Record10.SubTasks.Add(Record10Child1);
Record10.SubTasks.Add(Record10Child2);
GanttDataSource Record11 = new GanttDataSource()
{
TaskId = 38,
TaskName = "Final product",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record11Child1 = new GanttDataSource()
{
TaskId = 39,
TaskName = "Branding product",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "37",
};
GanttDataSource Record11Child2 = new GanttDataSource()
{
TaskId = 40,
TaskName = "Marketing and presales",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "39",
};
Record11.SubTasks.Add(Record11Child1);
Record11.SubTasks.Add(Record11Child2);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
GanttDataSourceCollection.Add(Record3);
GanttDataSourceCollection.Add(Record4);
GanttDataSourceCollection.Add(Record5);
GanttDataSourceCollection.Add(Record6);
GanttDataSourceCollection.Add(Record7);
GanttDataSourceCollection.Add(Record8);
GanttDataSourceCollection.Add(Record9);
GanttDataSourceCollection.Add(Record10);
GanttDataSourceCollection.Add(Record11);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public List<ResourceModel> Resources { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
public List<IndicatorsModel> Indicators { get; set; }
}
public class ResourceModel
{
public int ResourceId { get; set; }
public Nullable<int> ResourceUnit { get; set; }
}
public class IndicatorsModel
{
public string date { get; set; }
public string iconClass { get; set; }
public string name { get; set; }
public string tooltip { get; set; }
}
}
}
NOTE
- Individual tasks can lie between any time within the defined working time range of the project.
* ThedayWorkingTimeproperty is used to define the working time for the whole project.
Weekend/Non-working days
Non-working days/weekend are used to represent the non-productive days in a project. You can define the non-working days in a week using the workWeek property in Gantt.
@(Html.EJS().Gantt("WorkWeek").DataSource((IEnumerable<object>)ViewBag.DataSource).Height("450px").HighlightWeekends(true)
.TaskFields(ts => ts.Id("TaskId").Name("TaskName").StartDate("StartDate").Duration("Duration").Progress("Progress").Child("SubTasks"))
.WorkWeek(new string[] { "Sunday", "Monday", "Tuesday", "Wednesday","Thursday","Friday" })
.Render()
)using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
namespace WebApplication8.Controllers
{
public class HomeController : Controller
{
public ActionResult Index()
{
ViewBag.DataSource = ProjectNewData();
return View();
}
public static List<GanttDataSource> ProjectNewData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
List<IndicatorsModel> Indicators = new List<IndicatorsModel>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Product concept",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Child11 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Defining the product and its usage",
StartDate = new DateTime(2019, 04, 02),
Progress = 30,
Duration = 3,
};
GanttDataSource Child12 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Defining target audience",
StartDate = new DateTime(2019, 04, 02),
Duration = 3,
};
GanttDataSource Child13 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Prepare product sketch and notes",
StartDate = new DateTime(2019, 04, 02),
Progress = 30,
Duration = 2,
Predecessor = "2"
};
Record1.SubTasks.Add(Child11);
Record1.SubTasks.Add(Child12);
Record1.SubTasks.Add(Child13);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Concept approval",
StartDate = new DateTime(2019, 04, 02),
Duration = 0,
Predecessor = "3, 4",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "04/10/2019", name= "Design Phase", tooltip="Design phase completed", iconClass="okIcon e-icons" }
}
};
GanttDataSource Record3 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Market research",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record6Child1 = new GanttDataSource()
{
TaskId = 7,
TaskName = "Demand analysis",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record7Child1 = new GanttDataSource()
{
TaskId = 8,
TaskName = "Customer strength",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "5",
Progress = 30
};
GanttDataSource Record7Child2 = new GanttDataSource()
{
TaskId = 9,
TaskName = "Market opportunity analysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "5",
};
Record6Child1.SubTasks.Add(Record7Child1);
Record6Child1.SubTasks.Add(Record7Child2);
GanttDataSource Record6Child2 = new GanttDataSource()
{
TaskId = 10,
TaskName = "Competitor analysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "7, 8",
Progress = 30,
};
GanttDataSource Record6Child3 = new GanttDataSource()
{
TaskId = 11,
TaskName = "Product strength analsysis",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "9",
};
GanttDataSource Record6Child4 = new GanttDataSource()
{
TaskId = 12,
TaskName = "Research complete",
StartDate = new DateTime(2019, 04, 04),
Duration = 0,
Predecessor = "10",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "04/20/2019", name= "Research completed", tooltip="Research completed", iconClass="description e-icons" }
}
};
Record3.SubTasks.Add(Record6Child1);
Record3.SubTasks.Add(Record6Child2);
Record3.SubTasks.Add(Record6Child3);
Record3.SubTasks.Add(Record6Child4);
GanttDataSource Record4 = new GanttDataSource()
{
TaskId = 13,
TaskName = "Product design and development",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record13Child1 = new GanttDataSource()
{
TaskId = 14,
TaskName = "Functionality design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 30,
Predecessor = "12"
};
GanttDataSource Record13Child2 = new GanttDataSource()
{
TaskId = 15,
TaskName = "Quality design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "12"
};
GanttDataSource Record13Child3 = new GanttDataSource()
{
TaskId = 16,
TaskName = "Define reliability",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Progress = 30,
Predecessor = "15"
};
GanttDataSource Record13Child4 = new GanttDataSource()
{
TaskId = 17,
TaskName = "Identifying raw materials",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "15"
};
GanttDataSource Record13Child5 = new GanttDataSource()
{
TaskId = 18,
TaskName = "Define cost plan",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record18Child1 = new GanttDataSource()
{
TaskId = 19,
TaskName = "Manufacturing cost",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "17",
Progress = 30
};
GanttDataSource Record18Child2 = new GanttDataSource()
{
TaskId = 20,
TaskName = "Selling cost",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "17",
};
Record13Child5.SubTasks.Add(Record18Child1);
Record13Child5.SubTasks.Add(Record18Child2);
GanttDataSource Record13Child6 = new GanttDataSource()
{
TaskId = 21,
TaskName = "Development of the final design",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record21Child1 = new GanttDataSource()
{
TaskId = 22,
TaskName = "Defining dimensions and package volume",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "19, 20",
Progress = 30
};
GanttDataSource Record21Child2 = new GanttDataSource()
{
TaskId = 23,
TaskName = "Develop design to meet industry standards",
StartDate = new DateTime(2019, 04, 04),
Duration = 2,
Predecessor = "22",
};
GanttDataSource Record21Child3 = new GanttDataSource()
{
TaskId = 24,
TaskName = "Include all the details",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "23",
};
Record13Child6.SubTasks.Add(Record21Child1);
Record13Child6.SubTasks.Add(Record21Child2);
Record13Child6.SubTasks.Add(Record21Child3);
GanttDataSource Record13Child7 = new GanttDataSource()
{
TaskId = 25,
TaskName = "CAD Computer-aided design",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 30,
Predecessor = "24"
};
GanttDataSource Record13Child8 = new GanttDataSource()
{
TaskId = 26,
TaskName = "CAM Computer-aided manufacturing",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Predecessor = "25"
};
GanttDataSource Record13Child9 = new GanttDataSource()
{
TaskId = 27,
TaskName = "Design complete",
StartDate = new DateTime(2019, 04, 04),
Duration = 0,
Predecessor = "26",
};
GanttDataSource Record5 = new GanttDataSource()
{
TaskId = 28,
TaskName = "Prototype testing",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "27"
};
GanttDataSource Record6 = new GanttDataSource()
{
TaskId = 29,
TaskName = "Include feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "28ss",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "05/24/2019", name= "Production phase", tooltip="Production phase completed", iconClass="okIcon e-icons" }
}
};
GanttDataSource Record7 = new GanttDataSource()
{
TaskId = 30,
TaskName = "Manufacturing",
StartDate = new DateTime(2019, 04, 04),
Duration = 5,
Progress = 30,
Predecessor = "28, 29"
};
GanttDataSource Record8 = new GanttDataSource()
{
TaskId = 31,
TaskName = "Assembling materials to finsihed goods",
StartDate = new DateTime(2019, 04, 04),
Duration = 5,
Predecessor = "30"
};
Record4.SubTasks.Add(Record13Child1);
Record4.SubTasks.Add(Record13Child2);
Record4.SubTasks.Add(Record13Child3);
Record4.SubTasks.Add(Record13Child4);
Record4.SubTasks.Add(Record13Child5);
Record4.SubTasks.Add(Record13Child6);
Record4.SubTasks.Add(Record13Child7);
Record4.SubTasks.Add(Record13Child8);
Record4.SubTasks.Add(Record13Child9);
GanttDataSource Record9 = new GanttDataSource()
{
TaskId = 32,
TaskName = "Feedback and testing",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record9Child1 = new GanttDataSource()
{
TaskId = 33,
TaskName = "Internal testing and feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 45,
Predecessor = "31",
};
GanttDataSource Record9Child2 = new GanttDataSource()
{
TaskId = 34,
TaskName = "Customer testing and feedback",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 50,
Predecessor = "33",
};
Record9.SubTasks.Add(Record9Child1);
Record9.SubTasks.Add(Record9Child2);
GanttDataSource Record10 = new GanttDataSource()
{
TaskId = 35,
TaskName = "Final product development",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record10Child1 = new GanttDataSource()
{
TaskId = 36,
TaskName = "Important improvements",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "34",
};
GanttDataSource Record10Child2 = new GanttDataSource()
{
TaskId = 37,
TaskName = "Address any unforeseen issues",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "36ss",
Indicators = new List<IndicatorsModel>() {
new IndicatorsModel() { date = "06/21/2019", name= "Sales and marketing", tooltip="Sales and marketing", iconClass="description e-icons" }
}
};
Record10.SubTasks.Add(Record10Child1);
Record10.SubTasks.Add(Record10Child2);
GanttDataSource Record11 = new GanttDataSource()
{
TaskId = 38,
TaskName = "Final product",
StartDate = new DateTime(2019, 04, 04),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Record11Child1 = new GanttDataSource()
{
TaskId = 39,
TaskName = "Branding product",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Predecessor = "37",
};
GanttDataSource Record11Child2 = new GanttDataSource()
{
TaskId = 40,
TaskName = "Marketing and presales",
StartDate = new DateTime(2019, 04, 04),
Duration = 4,
Progress = 30,
Predecessor = "39",
};
Record11.SubTasks.Add(Record11Child1);
Record11.SubTasks.Add(Record11Child2);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
GanttDataSourceCollection.Add(Record3);
GanttDataSourceCollection.Add(Record4);
GanttDataSourceCollection.Add(Record5);
GanttDataSourceCollection.Add(Record6);
GanttDataSourceCollection.Add(Record7);
GanttDataSourceCollection.Add(Record8);
GanttDataSourceCollection.Add(Record9);
GanttDataSourceCollection.Add(Record10);
GanttDataSourceCollection.Add(Record11);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public string TaskType { get; set; }
public DateTime? StartDate { get; set; }
public DateTime? EndDate { get; set; }
public DateTime BaselineStartDate { get; set; }
public DateTime BaselineEndDate { get; set; }
public int? Duration { get; set; }
public bool IsManual { get; set; }
public int Progress { get; set; }
public string Predecessor { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
public int[] ResourceId { get; set; }
public List<ResourceModel> Resources { get; set; }
public string Notes { get; set; }
public int? Work { get; set; }
public int ParentID { get; set; }
public List<IndicatorsModel> Indicators { get; set; }
}
public class ResourceModel
{
public int ResourceId { get; set; }
public Nullable<int> ResourceUnit { get; set; }
}
public class IndicatorsModel
{
public string date { get; set; }
public string iconClass { get; set; }
public string name { get; set; }
public string tooltip { get; set; }
}
public class CheckList
{
public string id { get; set; }
public string day { get; set; }
public static List<CheckList> Days()
{
List<CheckList> Data = new List<CheckList>();
Data.Add(new CheckList { id = "Sunday", day = "Sunday" });
Data.Add(new CheckList { id = "Monday", day = "Monday" });
Data.Add(new CheckList { id = "Tuesday", day = "Tuesday" });
Data.Add(new CheckList { id = "Wednesday", day = "Wednesday" });
Data.Add(new CheckList { id = "Thursday", day = "Thursday" });
Data.Add(new CheckList { id = "Friday", day = "Friday" });
Data.Add(new CheckList { id = "Saturday", day = "Saturday" });
return Data;
}
}
}
}
NOTE
By default, Saturdays and Sundays are considered as non-working days/weekend in a project.
In the Gantt control, you can make weekend as working day by setting theincludeWeekendproperty totrue.
Duration units
In Gantt, the task’s duration value can be measured by the following duration units,
- Day
- Hour
- Minute
In Gantt, we can define duration unit for whole project by using durationUnit property, when we defines the value for this property, this unit will be applied for all task which don’t has duration unit value. And each task in the project can be defined with different duration units and the duration unit of a task can be defined by the following ways,
- Using
taskFields.durationUnitproperty, to map the duration unit data source field. - Defining the duration unit value along with the duration field in the data source.
Mapping the duration unit field
The below code snippet explains the mapping of duration unit data source field to the Gantt control using the taskFields.durationUnit property.
@Html.EJS().Gantt("Gantt").DataSource((IEnumerable<object>)ViewBag.DataSource).Height("450px").TaskFields(ts => ts.Id("TaskId").Name(
"TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").DurationUnit("DurationUnit").Progress(
"Progress").Child("SubTasks")).Render()public IActionResult Index()
{
ViewBag.DataSource = ganttData();
return View();
}
public static List<GanttDataSource> ganttData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Project initiation",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Child1 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Identify site location",
StartDate = new DateTime(2019, 04, 02),
Duration = 4,
Progress = 70,
DurationUnit="day"
};
GanttDataSource Child2 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Perform soil test",
StartDate = new DateTime(2019, 04, 02),
Duration = 16,
Progress = 50,
DurationUnit = "hour"
};
GanttDataSource Child3 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Soil test approval",
StartDate = new DateTime(2019, 04, 02),
Duration = 480,
Progress = 50,
DurationUnit = "minute"
};
Record1.SubTasks.Add(Child1);
Record1.SubTasks.Add(Child2);
Record1.SubTasks.Add(Child3);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Project estimation",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>()
};
GanttDataSource Child4 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Develop floor plan for estimation",
StartDate = new DateTime(2019, 04, 04),
Duration = 24,
Progress = 70,
DurationUnit = "hour"
};
GanttDataSource Child5 = new GanttDataSource()
{
TaskId = 7,
TaskName = "List materials",
StartDate = new DateTime(2019, 04, 04),
Duration = 3,
Progress = 50,
DurationUnit = "day"
};
Record2.SubTasks.Add(Child4);
Record2.SubTasks.Add(Child5);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public int? Duration { get; set; }
public int Progress { get; set; }
public string DurationUnit { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
}
NOTE
The default value of the
durationUnitproperty isday.
Defining duration unit along with duration field
Duration units for the tasks can also be defined along with the duration values, the below code snippet explains the duration unit for a task along with duration value,
@Html.EJS().Gantt("Gantt").DataSource((IEnumerable<object>)ViewBag.DataSource).Height("450px").TaskFields(ts => ts.Id("TaskId").Name(
"TaskName").StartDate("StartDate").EndDate("EndDate").Duration("Duration").Progress("Progress").Child("SubTasks")).Render()public IActionResult Index()
{
ViewBag.DataSource = ganttData();
return View();
}
public static List<GanttDataSource> ganttData()
{
List<GanttDataSource> GanttDataSourceCollection = new List<GanttDataSource>();
GanttDataSource Record1 = new GanttDataSource()
{
TaskId = 1,
TaskName = "Project initiation",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>(),
};
GanttDataSource Child1 = new GanttDataSource()
{
TaskId = 2,
TaskName = "Identify site location",
StartDate = new DateTime(2019, 04, 02),
Duration = "3days",
Progress = 70,
};
GanttDataSource Child2 = new GanttDataSource()
{
TaskId = 3,
TaskName = "Perform soil test",
StartDate = new DateTime(2019, 04, 02),
Duration = "12hours",
Progress = 50
};
GanttDataSource Child3 = new GanttDataSource()
{
TaskId = 4,
TaskName = "Soil test approval",
StartDate = new DateTime(2019, 04, 02),
Duration = "1800minutes",
Progress = 50
};
Record1.SubTasks.Add(Child1);
Record1.SubTasks.Add(Child2);
Record1.SubTasks.Add(Child3);
GanttDataSource Record2 = new GanttDataSource()
{
TaskId = 5,
TaskName = "Project estimation",
StartDate = new DateTime(2019, 04, 02),
EndDate = new DateTime(2019, 04, 21),
SubTasks = new List<GanttDataSource>()
};
GanttDataSource Child4 = new GanttDataSource()
{
TaskId = 6,
TaskName = "Develop floor plan for estimation",
StartDate = new DateTime(2019, 04, 04),
Duration = "480minutes",
Progress = 70
};
GanttDataSource Child5 = new GanttDataSource()
{
TaskId = 7,
TaskName = "List materials",
StartDate = new DateTime(2019, 04, 04),
Duration = "3days",
Progress = 50
};
Record2.SubTasks.Add(Child4);
Record2.SubTasks.Add(Child5);
GanttDataSourceCollection.Add(Record1);
GanttDataSourceCollection.Add(Record2);
return GanttDataSourceCollection;
}
public class GanttDataSource
{
public int TaskId { get; set; }
public string TaskName { get; set; }
public DateTime StartDate { get; set; }
public DateTime EndDate { get; set; }
public string Duration { get; set; }
public int Progress { get; set; }
public List<GanttDataSource> SubTasks { get; set; }
}
NOTE
The edit type of the duration column in Gantt is string, to support editing the duration field along with duration units.