How to disable editing for a specific cell in Gantt

Gantt allows you to edit a cell, when you double click on the cell, and when EditSettings.AllowEditing’ property is set to true and ‘EditSettings.EditMode’ property is set to ‘cellEditing’.

In order to disable editing for a particular cell, you have to cancel the ‘BeginEdit’ event for that cell. Since this event will be triggered whenever a cell is about to enter edit mode, cancelling this event by setting ‘args.cancel’ to ‘true’ in the event handler will prevent the cell from entering into edit mode.

In the following code example, editing on the cell with progress status as 100% have been cancelled as well as editing on all the cells in ‘startDate’ column have also been cancelled.

CSHTML

@(Html.EJ().Gantt("Gantt").
    //... 
    .ClientSideEvents(eve => {
        eve.BeginEdit("BeginEdit");
    })
    //...
) 
 
    <script type="text/javascript">
 
        function BeginEdit(args) {
            var ganttObject = $("#Gantt").data("ejGantt");
            var columns = this.getColumns();
 
            //To cancel the editing if status is equal to 100
            if (args.data.status == 100)
                args.cancel = true;
 
                //To cancel the start date editing if status > 0
            else if ((args.data.status > 0 && args.columnIndex && columns[args.columnIndex].field == "startDate"))
                args.cancel = true;
 
        }
</script>
 

A simple sample to disable editing for a specific cell in Gantt is available in the following link.

Sample