Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

213
Views
Dragging tasks within the end date of source task DHTMLX Gantt

i customize a DHTMLX gantt with my db. For Data i only choose id, text, start_date, duration and end_date. For links i choose id, souce, target and type, all types are 0.

I’ve done dragging task together with their dependent task, moving task manualy. Moving Descendants synchronously with the main task( link: https://docs.dhtmlx.com/gantt/desktop__dragging_dependent_tasks.html#movingtasksmanually )

I’ve add to my gantt.aspx this code:


gantt.eachSuccessor = function (callback, root) {
if (!this.isTaskExists(root))
return;

  // remember tasks we've already iterated in order to avoid infinite loops
        var traversedTasks = arguments[2] || {};
        if (traversedTasks[root])
            return;
        traversedTasks[root] = true;

        var rootTask = this.getTask(root);
        var links = rootTask.$source;
        if (links) {
            for (var i = 0; i < links.length; i++) {
                var link = this.getLink(links[i]);
                if (this.isTaskExists(link.target) && !traversedTasks[link.target]) {
                    callback.call(this, this.getTask(link.target));

                    // iterate the whole branch, not only first-level dependencies
                    this.eachSuccessor(callback, link.target, traversedTasks);
                }
            }
        }
    };

    gantt.attachEvent("onTaskDrag", function (id, mode, task, original) {
        var modes = gantt.config.drag_mode;

        if (mode == modes.move) {
            var diff = task.start_date - original.start_date;
            gantt.eachSuccessor(function (child) {
               
                    child.start_date = new Date(+child.start_date + diff);
                    child.end_date = new Date(+child.end_date + diff);
                    gantt.refreshTask(child.id, true);
                }, id);
            }
        return true;
    });
    gantt.attachEvent("onAfterTaskDrag", function (id, mode, e) {
        var modes = gantt.config.drag_mode;
        if (mode == modes.move) {
            gantt.eachSuccessor(function (child) {
                child.start_date = gantt.roundDate(child.start_date);
                child.end_date = gantt.calculateEndDate(child.start_date, child.duration);
                gantt.updateTask(child.id);
            }, id);
        }
    });```


Now i have to add the constrain that a child(target) task can’t move before the end date of father(source). I have to add a Left limit for all tasks, but i have no idea how to do, because i haven’t “parent” on my data details.
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

In the onTaskDrag event handler you have the task object of the task you are dragging. For the related tasks, there is the child variable, though the tasks are not necessarily the children of the dragged task. So, you can get the end date of the task you are dragging from the task object. In the onAfterTaskDrag event handler, you don't have the task object, but you can get it by using the gantt.getTask(id) method:

    gantt.attachEvent("onAfterTaskDrag", function (id, mode, e) {
        var task = gantt.getTask(id);
        var modes = gantt.config.drag_mode;
        if (mode == modes.move) {
            gantt.eachSuccessor(function (child) {
                child.start_date = gantt.roundDate(child.start_date);
                child.end_date = gantt.calculateEndDate(child.start_date, child.duration);
                gantt.updateTask(child.id);
            }, id);
        }
    });

https://docs.dhtmlx.com/gantt/api__gantt_gettask.html

You can also use the auto-scheduling feature: https://docs.dhtmlx.com/gantt/desktop__auto_scheduling.html

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!