Skip to main content

Task Parent/Child

In this article, you will find methods related to the tree structure of Gantt chart tasks.

To learn about basic operations for getting the task object or ID, refer to the Task Object/Id article.

Parent of a task

To get the parent of a task, use the getParent() method or the "parent" property of the task object:

gantt.getParent("t1"); // -> "pr_2"
// or
const task = gantt.getTask("t1"); // -> { id: "t1", text: "Task #5", parent: "pr_2", ... }
const parentId = task.parent; // -> "pr_2"

If there is no parent for the specified task, the method returns the root ID.

Children of a task

To get the children of a branch task, use the getChildren() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18 },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" }
]
};

gantt.getChildren("p_1"); // -> ["t_1"]

To get all children of a task, not only first-level child tasks, use the eachTask() method and pass the parent task ID as the second parameter:

const childTasks = [];

// Iterate through all children of a task.
gantt.eachTask((childTask) => {
childTasks.push(childTask);
}, 11);

Checking if a task has a child

To check whether a task has a child task, use the hasChild() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.hasChild("p_1"); // -> true
gantt.hasChild("t_1"); // -> false

Next task in a tree

To get the ID of the task next to the specified one, use the getNext() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" },
{ id: "t_2", text: "Task #2", start_date: "2027-04-11", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.getNext("p_1"); // -> "t_1"
gantt.getNext("t_1"); // -> "t_2"
gantt.getNext("t_2"); // -> null

Gantt considers tasks regardless of the tree level.

Previous task in a tree

To get the ID of the task previous to the specified one, use the getPrev() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" },
{ id: "t_2", text: "Task #2", start_date: "2027-04-11", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.getPrev("p_1"); // -> null
gantt.getPrev("t_1"); // -> "p_1"
gantt.getPrev("t_2"); // -> "t_1"

Gantt considers tasks regardless of the tree level.

Siblings of a task

To get the siblings of the specified task, use the getSiblings() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" },
{ id: "t_2", text: "Task #2", start_date: "2027-04-11", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.getSiblings("t_1"); // -> ["t_1", "t_2"]

Next sibling of a task

To get the next sibling of the specified task, use the getNextSibling() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" },
{ id: "t_2", text: "Task #2", start_date: "2027-04-11", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.getNextSibling("t_1"); // -> "t_2"
gantt.getNextSibling("t_2"); // -> null

Previous sibling of a task

To get the previous sibling of the specified task, use the getPrevSibling() method:

const taskData = {
tasks: [
{ id: "p_1", text: "Project #1", start_date: "2027-04-01", duration: 18, open: true },
{ id: "t_1", text: "Task #1", start_date: "2027-04-02", duration: 8, parent: "p_1" },
{ id: "t_2", text: "Task #2", start_date: "2027-04-11", duration: 8, parent: "p_1" }
]
};
gantt.init("gantt_here");
gantt.parse(taskData);

gantt.getPrevSibling("t_2"); // -> "t_1"
gantt.getPrevSibling("t_1"); // -> null
Need help?
Got a question about the documentation? Reach out to our technical support team for help and guidance. For custom component solutions, visit the Services page.