Gantt - Taskbar Editing - Disable moving with condition

[Yunus]

Hi,

I'm trying to disable taskbar editing for some rows on a condition. There is a similar question for jquery component:
https://www.syncfusion.com/forums/145210/disable-moving-with-condition

Using the information in this thread and some others, I managed to change the cursor style and hide editing elements. However, I could not disable moving. Can you help on this requirement please?

Thanks & Kind regards

[Alagumeena Kalaiselvan]

Hi Yunus, 

  

Thanks for contacting Syncfusion support 

  

Currently we are checking the possibility to disable moving of Taskbar editing in Gantt and we will update the details by tomorrow 11^th February, 2022. 

  

Regards 

Alagumeena.K 

[Alagumeena Kalaiselvan]

Hi Yunus, 

Currently the Gantt doesn’t have inbuild support to disable the Taskbar edit action but you can achieve the requirement by work around. For that, you need to do below steps 

• Add the custom class for specific Task which you want to restrict edit action in QueryChartRowInfo event
• Invoke Microsoft JSInterop method to bind mousedown event for Taskbar and call stopPropagation method which restrict editing

<SfGantt @ref="Gantt" DataSource="@TaskCollection" Height="450px" Width="800px" HighlightWeekends="true" 

                     Toolbar="@(new List<string>(){ "Add", "Edit", "Update", "Delete", "Cancel", "ExpandAll", "CollapseAll","Indent","Outdent"})" 

                     AllowSelection="true" GridLines="Syncfusion.Blazor.Gantt.GridLine.Both" TreeColumnIndex="1" 

                     ProjectStartDate="@ProjectStart" ProjectEndDate="@ProjectEnd" AllowRowDragAndDrop="true"> 

    ... 

   <GanttEvents TValue="TaskData" QueryChartRowInfo="ChartRowInfo"></GanttEvents> 

</SfGantt> 

@code{ 

   public async Task ChartRowInfo(QueryChartRowInfoEventArgs<TaskData> args) 

    { 

        dynamic data = Gantt.GetHierarchicalData(args.Data.TaskId); 

        if (args.Data.TaskId == 2) 

        { 

            args.Row.AddClass(new string[] { " DisableTaskbar " });  // add custom class for Taskbar 

            await JS.InvokeVoidAsync("GanttTaskbarMove");            // Invoke js method 

        } 

    } 

... 

} 

~/Host.cshtml 

<script> 

        window.GanttTaskbarMove = () => { 

            setTimeout(function() { 

                var container = document.getElementsByClassName("DisableTaskbar")[0]; 

                var taskbar = container.getElementsByClassName("e-taskbar-main-container")[0]; 

            taskbar.addEventListener("mousedown", function(e) { 

                    e.stopPropagation()});       // To restrict Taskbar editing 

            }, 1000);  

        }; 

</script> 

The above sample can be get from below link 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorGantt136370202 

Please get back to us, if you need further assistance 

Regards 

Alagumeena.K 

[Yunus]

Hi Alagumeena,

I tried your solution, and it works great.
Thank you very much.

Can you please consider adding this subject as a built-in property/feature in the future versions?

Kind regards

Yunus

[Alagumeena Kalaiselvan]

Hi Yunus, 

 

Thanks for the update. 

As you requested we have considered your requirement “Disable the Taskbar editing” as improvement and logged improvement request for that which can be tracked from below link. 

Feedback Link: https://www.syncfusion.com/feedback/33479/provide-taskbarbeginedit-support-to-customize-taskbar-editing 

 

As we have already lined up with some major features, we could not start this feature immediately. We will implement this support and include in any our upcoming releases. 

 

Regards 

Alagumeena.K