Automatically reordering tasks

Gantt
#1

Hello. Lets say we have 3 tasks(bonding 8,9,10) starting at 0.now if i connect task 8 and 9 with 8 being source task and 9 being target task it appears as below

IMG_20230223_151307
IMG_20230223_1513071920×435 137 KB

But i want it to appear in a ordered way(as above between bonding 1 and2) .This i have achieved by using gantt. Config. Order_branch but pblm here is we cant say to user that u have to reorder ur tasks, it should be done automatically for simplicity. So any solution please?

Thank you

#2

Hello. Is there any alternate solution?

#3

Hello,
Unfortunately, there is no such built-in solution.
To automatically change the vertical order of tasks, you can try something like this:

For example, I added a row number for each task:

let taskNumbers = null;

function calculateAll() {
    taskNumbers = {};
    let index = 1;

    gantt.eachTask((task) => {
        taskNumbers[task.id] = index;
        task.num = index;
        index++;
    });
}

function resetCache(){
    taskNumbers = null; 

    return true;
}

gantt.getTaskNumber = (task) => {
    if (!taskNumbers) {
        calculateAll()
    }
    
    return taskNumbers[task.id];
};

gantt.attachEvent("onTaskCreated", resetCache);
gantt.attachEvent("onAfterTaskMove", resetCache);
gantt.attachEvent("onBeforeParse", resetCache);
gantt.attachEvent("onAfterTaskDelete", resetCache);
gantt.attachEvent("onAfterTaskAdd", resetCache);
gantt.attachEvent("onAfterSort", resetCache);

gantt.config.columns = [
    { name: "num",        width: 30,  align: "center", label: "Num",  template: gantt.getTaskNumber },
    { name: "text",       width: 170, label: "Task name", tree: true },
    { name: "start_date", width: 90,  align: "center"},
    { name: "duration",   width: 60,  align: "center"},
    { name: "add",        width: 40}
];

Then after adding the link (using onAfterLinkAdd handler) I sort the tasks by row number:

gantt.attachEvent("onAfterLinkAdd", function(id,item) {
    const sourceTask = gantt.getTask(item.source);
    const targetTask = gantt.getTask(item.target);

    if (sourceTask.num > targetTask.num) {
        const prevSourceTasknum = sourceTask.num;
        sourceTask.num = targetTask.num;
        targetTask.num = prevSourceTasknum;
        gantt.sort("num", false);
    }
});

Please see an example: https://snippet.dhtmlx.com/iulee6d5. This is not a complete example, but based on it, you can modify it to suit your needs.
You can also contact the development department contact@dhtmlx.com if the proposed solution does not meet your expectations.

#4

Hello. Thanks for the reply. I found solution using move task and reorder them.