Skip to main content

Operations with tasks

Adding a new task​

To add a new task to the list, use the addTask() method:

list.addTask({
    id: "1.1.1",
    project: "first",
    parent: "1.1",
    targetId: "1.1.2",
    reverse: true,
    task: {
        text: "Task 1.1.1",
    }
});

Copying/pasting a task​

Copy and paste​

The quickest way to copy and paste a task is use the copyTask() method. For that, it is necessary to pass the following parameters to the method:

  • the ID of the task that you want to copy and paste
  • the ID of the future project (if it exists)
  • the ID of the target task where the copied task should be pasted
  • other parameters are optional
list.copyTask({ 
    id: "1.1", // ID of the task to copy
    join: false, // resets copies of other tasks and copies only this task
    project: "p_2", // ID of the future project (if exists)
    parent: "2.1", // ID of the future parent
    targetId: "2.1.2", // ID of the target task
    reverse: true // the task will be pasted before the target one
});

Copy to the clipboard​

To copy a necessary task to the clipboard without its further pasting, pass the ID of the task to the copyTask() method:

list.copyTask({ 
    id: "1.1"
});

Saving IDs of other copies​

info

If you want to copy the task and save other previously copied tasks, you need to pass the join: true parameter to the copyTask() method. Otherwise, only the specified task will be copied, all others copies created earlier will be reset.

Paste from the clipboard​

You can paste the copied task from the clipboard to the necessary place via the pasteTask() method:

list.pasteTask({ 
    parent: "1",
    targetId: "1.2",
});

Updating a task​

To dynamically update parameters of a task, apply the updateTask() method:

list.updateTask({ 
    id: "1.1.1",
    task: {
        text: "Completed task"
    }
});

Moving a task​

To move a task to another position, use the moveTask() method:

list.moveTask({ 
    id: "1.1", // ID of the task to move
    project:"p_2", // ID of the future project (if exists)
    parent: "2", // ID of the future parent
    targetId: "2.1", // ID of the target task
    reverse: true // the task will be placed before the target one
});
note

If you move a parent task, it will be moved together with its subtasks.

Deleting a task​

To delete a task, use the deleteTask() method:

list.deleteTask({ id: "1.2" });
note

The method removes the task with all its child tasks

Expanding/collapsing a task​

To collapse a task, use the collapseTask() method. The method takes the ID of the task as a parameter:

list.collapseTask({ id: "1.1" });

To expand a collapsed task by its ID, use the expandTask() method:

list.expandTask({ id: "1.1" });

Marking a task complete/incomplete​

You may mark the necessary task as complete/incomplete via the corresponding checkTask() and uncheckTask() methods:

list.checkTask({ 
    id: "1.1.1",
    manual: false
});

list.uncheckTask({ 
    id: "1.1.1",
    manual: false
});

When manual: false is set, the result of applying the method depends on the value which is specified for the behavior attribute of the completed parameter of the taskShape property.

If the "auto" mode is specified via the taskShape property but you need to check/uncheck the task in the "manual" mode, set the manual parameter of the checkTask() or uncheckTask() method to true:

list.checkTask({ 
    id: "1.1.1",
    manual: true
});

list.uncheckTask({ 
    id: "1.1.1",
    manual: true
});

Changing the indent level of a task​

To change the nesting level of a task dynamically, use the following two methods:

  • indentTask() - to demote the nesting level of a task to one lower level
const list = new ToDo("#root", {
    tasks: [
        { id: "1", text: "Task 1 #tag1" },
        { id: "1.1", text: "Task 1.1", parent: "1" },
        { id: "1.1.1", text: "Task 1.1.1", parent: "1.1" },
        { id: "1.2", text: "Task 1.2", parent: "1" },
    ]
});

list.indentTask({ id: "1.2" });

console.log(list.getParentIds({ id: "1.2" })); //  ['1.1', '1']
  • unindentTask() - to promote the nesting level of the task to one higher level
const list = new ToDo("#root", {
    tasks: [
        { id: "1", text: "Task 1 #tag1" },
        { id: "1.1", text: "Task 1.1", parent: "1" },
        { id: "1.1.1", text: "Task 1.1.1", parent: "1.1" },
        { id: "1.2", text: "Task 1.2", parent: "1" },
    ]
});

list.unindentTask({ id: "1.2" });

console.log(list.getParentIds({ id: "1.2" })); //  []
info

The result of applying the methods depends on the structure of the list

Filtering tasks​

You can find the tasks that match the specified criteria with the help of the setFilter() method. The method supports the strict mode of filtering that allows you to filter tasks by the exact match.

// filter data by the specified rules
list.setFilter({
    match: "#tag1",
    highlight: true,
    strict: true
});

To reset filtering, call the method without parameters:

// reset filtering
list.setFilter({});