Grids
Example of Resource Multi Taskbar in ASP.NET Core Gantt Chart Control
This sample demonstrates how to visualize a list of tasks assigned to a resource within a collapsed parent row. It also allows modifying task scheduling actions such as dragging, left resizing, and progress editing while keeping the parent row collapsed.
This functionality can be enabled by setting the enableMultiTaskbar property to true.
Are you sure you want to Delete Record?
ID | Name | Work | Progress | Start Date | Duration | UniqueID |
|---|---|---|---|---|---|---|
| R-1 | Martin Tamer | 40.00 hours | 30 | 3/29/2024 | 11.07 days | 0 |
| T-2 | Identify Site Location | 10.00 hours | 30 | 3/29/2024 | 2.5 days | 1 |
| T-3 | Perform Soil Test | 20.00 hours | 30 | 4/2/2024 | 3.57 days | 2 |
| T-4 | Soil Test Approval | 10.00 hours | 30 | 4/8/2024 | 5 days | 3 |
| R-2 | Rose Fuller | 150.00 hours | 30 | 4/1/2024 | 32 days | 4 |
| T-6 | Develop Floor Plan for Estimation | 50.00 hours | 30 | 4/1/2024 | 12.5 days | 5 |
| T-7 | List Materials | 40.00 hours | 30 | 4/15/2024 | 12.5 days | 6 |
| T-8 | Estimation Approval | 60.00 hours | 30 | 5/1/2024 | 10 days | 7 |
| R-3 | Margaret Buchanan | 224.00 hours | 24 | 4/1/2024 | 24 days | 8 |
| T-10 | Install Temporary Power Service | 112.00 hours | 30 | 4/1/2024 | 14 days | 9 |
| T-11 | Clear the building site | 72.00 hours | 30 | 4/17/2024 | 9 days | 10 |
| T-12 | Sign Contract | 40.00 hours | 0 | 4/26/2024 | 5 days | 11 |
| R-4 | Fuller King | 48.00 hours | 20 | 4/1/2024 | 7 days | 12 |
| T-14 | Excavate for Foundations | 16.00 hours | 30 | 4/1/2024 | 2 days | 13 |
| T-15 | Dig Footer | 16.00 hours | 0 | 4/4/2024 | 2 days | 14 |
| T-16 | Install plumbing grounds | 16.00 hours | 30 | 4/8/2024 | 2 days | 15 |
| R-5 | Davolio Fuller | 48.00 hours | 20 | 4/3/2024 | 7 days | 16 |
| T-18 | Add load-bearing structure | 16.00 hours | 30 | 4/3/2024 | 2 days | 17 |
| T-19 | Natural Gas Utilities | 16.00 hours | 0 | 4/5/2024 | 2 days | 18 |
| T-20 | Electrical utilitites | 16.00 hours | 30 | 4/10/2024 | 2 days | 19 |
Mar 28, 2024 | Mar 31, 2024 | Apr 07, 2024 | Apr 14, 2024 | Apr 21, 2024 | Apr 28, 2024 | May 05, 2024 | May 12, 2024 |
|---|
T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F | S | S | M | T | W | T | F |
|---|
Validate Editing
This example demonstrates how to enable taskbar drag-and-drop functionality for reassigning tasks between resources vertically by setting the allowTaskbarDragAndDrop property to true. Additionally, you can prevent taskbar overlap within a resource's tasks by disabling the allowTaskbarOverlap property.
In this example, resources are assigned to tasks using predefined resource IDs, allowing efficient task distribution. The resource details are displayed using the LabelSetting labelSetting property.
You can also perform CRUD operations on resource allocation using toolbar actions, considering availability and task complexity.
The resources and their assigned tasks are grouped into categories. Resources can be mapped using the following resourceFields:.
ID: Maps the resource ID.
Name: Maps the resource name.
Unit: Maps the resource unit.
Group: Maps the resource group.
Injecting module:
The Gantt control features are segregated into individual feature-wise modules. To use a selection, inject the
Selection module using the Gantt.Inject(Selection) method. To use markers, inject the
DayMarkers module using the Gantt.Inject(DayMarkers) method.
To edit, inject the Toolbar module using the Gantt.Inject(Toolbar) method and Edit module
using the Gantt.Inject(Edit) method.