Creating Dependencies through Dragging
The Gantt provides the option for creating new dependencies by dragging from the drag clue of a given task to the drag clue of another.
Basic Concepts
To enable creating dependencies through dragging, apply the kendoGanttDependencyDragCreate
directive to the <kendo-gantt>
element. Once applied, it will render drag clues before and after the task when hovered. Dragging from one clue to another will result in the Gantt emitting the dependencyAdd
event with data for the new dependency.
Note that the Gantt ships with a built-in mechanism for evaluating whether an attempted dependency is valid. The default validator can be replaced with a custom one if needed. For more information about the default validation rules, or how to plug in your own validation logic, refer to the article on validation.
The following example demonstrates how to handle the dependencyAdd
event and create the new dependencies.
Validation
By default, when trying to create new dependencies with dragging, the Gantt will evaluate each attempt and mark it as invalid in the following cases:
- When the two tasks are in a parent-child relationship.
- When the two tasks are already dependent on one another. Only one dependency is allowed per pair.
- When the start or end times of the two tasks are incompatible with the attempted dependency type.
To replace the built-in validation logic with a custom one, provide a validateNewDependency
callback.
The following example showcases how to provide a custom validation callback.
Validation Tooltip
During each drag-create operation, a tooltip will provide information about the predecessor and successor tasks, and the validity of the attempted dependency.
The following example demonstrates the validation tooltip.
Auto-Scrolling
When the content of the timeline overflows, it will be scrolled when dragging outside the boundaries of the container.
By default the scroll speed is 1 pixel per millisecond, and auto-scrolling is triggered when dragging within 10 pixels threshold from the visible boundaries of the timeline.
To customize this behavior, bind the dragScrollSettings
option to a DragScrollSettings
object with the preferred step
, interval
and threshold
values.
The following example demonstrates how to modify the scroll settings.