Our state of the art Gantt chart


Post by bharat95 »

Hi,

I want to limit drag and drop of subtask to the parent task only. I'm using typescript, how I can handle this.

Thanks,
Bharat


Post by alex.l »

Hi Bharat,

There is preventable https://bryntum.com/products/gantt/docs/api/Gantt/feature/TaskDrag#event-beforeTaskDrag event.
Just add check you need into handler and return true/false to allow/prevent action.
As example, check https://bryntum.com/products/gantt/docs/api/Core/data/mixin/TreeNode#property-isParent property of draggable record.

All the best,
Alex


Post by bharat95 »

Hi,

Can you please provide sample code for prevent action?

Thanks,
Bharat


Post by tasnim »

Hi,

Here is an example code snippet for you

    listeners : {
        beforeTaskDrag ({ taskRecord }) {
            if (taskRecord.isParent) {
                return false;
            }
        }
    }

Post by bharat95 »

Hi,

I want to disable drag and drop for specific task. Also, subtask should not be dragged outside of the parent task.


Post by tasnim »

Hi,

Do you mean row reordering by drag and drop?

chrome_61xl2sJRip.gif
chrome_61xl2sJRip.gif (231.83 KiB) Viewed 346 times

Post by bharat95 »

Hi,

No, Like in above example the sub task of set up web server should not be able to be dragged inside Website design.

Thanks,
Bharat


Post by tasnim »

Hi,

You could use https://bryntum.com/products/gantt/docs/api/Grid/feature/RowReorder#event-gridRowBeforeDropFinalize to achieve that

chrome_JHDjULHX10.gif
chrome_JHDjULHX10.gif (358.1 KiB) Viewed 330 times

And here is the code I used to implement this

    features : {
        rowReorder : {
            listeners : {
                gridRowBeforeDropFinalize (event) {
                    const { context } = event;
                    const gantt = window.gantt;
                    const parent = gantt.project.taskStore.getById(context.oldPositionContext[0].parentId);
                    if (parent.name.toLowerCase() === 'setup web server' && context.insertBefore.parent?.name.toLowerCase() === 'website design') {
                        context.valid = false;
                    }
                }
            },
        }
    }

Post by bharat95 »

Hi,

I'm using typescript with react. I'm getting error 'Parameter 'event' implicitly has an 'any' type.'


Post by tasnim »

Hi,

Try setting the event param to any

gridRowBeforeDropFinalize (event : any) {

Post Reply