[ANGULAR] drag and drop tasks according to conditions

[ducminh1511]

Hello friends,

In the data file I have a color field, and in the ganttConfig.ts file I am leaving taskDrag: true, taskResize: true, all tasks are drag and drop. But I want to filter by color field, if the task has color! = '# 303331' then drag and drop, otherwise if the task has color = '# 303331', it will not allow drag and drop. Can you guys support me?

[saki]

The key would be to put in a bit more in taskDrag feature where you would specify https://bryntum.com/docs/gantt/#Gantt/feature/TaskDrag#config-validatorFn which would decide about draggability of events. We have an example of that for Scheduler: https://bryntum.com/examples/scheduler/validation/ Here's the screenshot.

Screen Shot 2021-03-02 at 14.12.12.png (868.5 KiB) Viewed 1109 times

[ducminh1511]

I did like my code above but can't seem to get the correct color field in the data file to check. See where my code is wrong

[mats]

Please post your code so we can run it, do not post screenshots of your code

[ducminh1511]

Here is my code. My wish is that when initially entering, all tasks will not be dragable, after clicking the "EDIT" button the tasks will be able to drag and drop, but will check in the data file with the condition that the color field = == '# 303331' will not be able to drag and drop. Can you guys support me? Thank you for your help.

[alex.l]

Hi ducminh1511,

Please check our docs: https://bryntum.com/docs/gantt/#Gantt/feature/TaskDrag#config-validatorFn
Looks like you used wrong param names, it should be something like:

validatorFn(taskRecords, date, duration) {
    const
        firstDraggedTask = taskRecords[0], // or better use a loop
        isValid = firstDraggedTask.color === '#303331';
    return {
        valid: newResource.available && isValid,
    };
}

All the best,
Alex

[ducminh1511]

I did it your way but it doesn't work, can you fix it for me through my source code below. My wish is that when initially entering, all tasks will not be dragable, after clicking the "EDIT" button the tasks will be able to drag and drop, but will check in the data file with the condition that the color field = == '# 303331' will not be able to drag and drop. Can you guys support me? Thank you for your help.

[mats]

Have you added the 'color' field to your Event model?

[ducminh1511]

in the code I have sent in the attachment is already there

[mats]

Well, you should still be able to answer a simple question