SfGantt and CustomAdaptor - Trigger task recalculation

[Volker]

Hi there,

is it possible to call a function that updates all tasks of a gantt-diagram (consuming from SQL-Server) manually?

Let's say there are two tasks with a dependency of 2 days:


Now I change the end time of task A.
Then the start and end date of task B must be updated to fit to the new end time of task A.

In addition all progresses of parent tasks must be recalculated if childrens' progresses changes.

Lets say we modify the progress of task B and save it to SQL-Server, then the progress of the parent task must be recalculated, too.

When I use drag & drop within the SfGantt or use the build-in dialog all tasks get updated as expected.

In my business case I have to write my own dialog to edit tasks cause there is much more complexity we need.
So is it possible to manually call your build in-functions of the SfGantt-component to trigger/update/recalculate all tasks (date and progress) of a given sql-table list of tasks but using my own custom task-editor that calls the reshape-function after pressing SAVE (without writing my own business logic to analyse all parent Ids and dependencies)?

Any idea?

Cheers,
Volker

[Gopinath Muniraj]

Hi Volker, 

Thanks for contacting Syncfusion support. 

We have analyzed your query. 

Yes. It is possible to update a task and that’s dependent tasks using custom dialog in the Gantt with the help of UpdateRecordByID method. Please refer the below code snippet. 

 

[Index.razor] 

<SfDialog ID="DialogContainer" @ref="Dialog" Width="400px" IsModal="true" Header="Gantt Custom Dialog" @bind-Visible="@IsVisible"> 

    <DialogTemplates> 

        <Content> 

            <label>ID</label><br /> 

            <SfTextBox ID="InputIdContainer" @ref="InputId" Placeholder="Id" Width="300px" Value="@Id" Enabled="false"></SfTextBox><br/> 

            <label>Task Name</label><br /> 

            <SfTextBox ID="InputNameContainer" @ref="InputName" Placeholder="TaskName" Width="300px" Value="@Name"></SfTextBox><br /> 

            <label>Progress</label><br /> 

            <SfTextBox ID="InputProgressContainer" @ref="InputProgress" Placeholder="Progress" Width="300px" Value="@Progress"></SfTextBox><br /> 

            <label>Start Date</label><br /> 

            <SfTextBox ID="InputsDateContainer" @ref="InputsDate" Placeholder="StartDate" Width="300px" ></SfTextBox><br /> 

            <label>End Date</label><br /> 

            <SfTextBox ID="InputeDateContainer" @ref="InputeDate" Placeholder="EndDate" Width="300px" ></SfTextBox><br /> 

        </Content> 

    </DialogTemplates> 

    <DialogButtons> 

        <DialogButton Content="Ok" OnClick="@OkDialog"></DialogButton> 

        <DialogButton Content="Cancel" OnClick="@CloseDialog" /> 

    </DialogButtons> 

    <DialogAnimationSettings Effect="DialogEffect.None" /> 

</SfDialog> 

<SfGantt @ref="Gantt" ID="GanttExport"> 

            //... 

</SfGantt> 

//... 

@code { 

    public string Name { get; set; } 

    public string Id { get; set; } 

    public string Progress { get; set; } 

    public DateTime? Sdate { get; set; } 

    public DateTime? Edate { get; set; } 

    private bool IsVisible { get; set; } = false; 

    public SfGantt<Table> Gantt; 

    public SfDialog Dialog; 

    public SfTextBox InputName; 

    public SfTextBox InputProgress; 

    public SfTextBox InputId; 

    public SfTextBox InputsDate; 

    public SfTextBox InputeDate; 

    public void actionBegin(ActionBeginArgs<Table> args) 

    { 

        if (args.RequestType == "beforeOpenEditDialog") 

        { 

            //Restricting the opening of default dialog 

            args.Cancel = true; 

            RenderDialog(args.RowData.TaskData); 

        } 

    } 

    //Method to render the custom dilaog 

    public void RenderDialog(Table data) 

    { 

        Id = data.Id.ToString(); 

        Name = data.Name; 

        Progress = data.Progress; 

        Sdate = data.Sdate; 

        Edate = data.Edate; 

        this.Dialog.Show(); 

    } 

    private void CloseDialog() 

    { 

        this.Dialog.Hide(); 

    } 

    private void OkDialog() 

    { 

        // Updating the record using UpdateRecordByID method 

        this.Gantt.UpdateRecordByID(new Table() 

        { 

            Id = Convert.ToInt16(this.InputId.Value), 

            Name = this.InputName.Value, 

            Progress = this.InputProgress.Value, 

            Sdate = Convert.ToDateTime(this.InputsDate.Value), 

            Edate = Convert.ToDateTime(this.InputeDate.Value), 

        }); 

        this.Dialog.Hide(); 

    } 

} 

//... 

 

Also, we would like to inform that, the data which is passing in the method UpdateRecordByID should contain field which are required to update, and the ID field is mandatory in that data collection. So that the edited data is updated properly. 

 

We have prepared a sample to edit the Gantt data using custom dialog. Please refer the sample link below. 

Sample: https://www.syncfusion.com/downloads/support/forum/158158/ze/Blazor-custom-dialog-266980503 

 

Please let us know if you need any further assistance on this. 

Thanks, 

Gopinath M 

[Volker]

Hi Gopinath,

thank you.

I've implemented your solution and made some very basic tests:

• When I change both the end date and the progress of task B (child) in custom dialog and call your function (childID), then the parent task (end-date and progress) gets updated automatically, too.
• When I change the progress of task B only (let's say from 10% to 80%) in custom dialog and call your function (childID), then this time the parent task (new overall progress) is not updated

Can you confirm this behavior?

Cheers,
Volker

[Gopinath Muniraj]

Hi Volker, 

Sorry for the inconvenience caused. 

In the previous updated sample, values of selected record not properly populate on the custom dialog inputs like start date and end date values. Hence, the data passed to the updateRecordByID is not containing Startdate and end date i.e.., the value of Start date and end date passed as null. That’s why the task is not updated properly (Progress not updated). 

This is due to the, textbox of start date and end date was empty. Now we have changed the sample to pass the data to the updateRecordByID method with correct start date and date. Please find the code snippet below, 

private void OkDialog() 

{ 

            var editedData = new Table() 

            { 

                        Id = Convert.ToInt16(this.InputId.Value), 

                        Name = this.InputName.Value, 

                        Progress = this.InputProgress.Value, 

                        Sdate = Convert.ToDateTime(this.InputsDate.Value), 

                        Edate = Convert.ToDateTime(this.InputeDate.Value), 

                        Predecessor = this.InputDep.Value, 

                        ParentId = this.InputPar.Value 

            }; 

             //editedData containing the all fields of the Table before passing it to the UpdateRecordByID method 

            this.Gantt.UpdateRecordByID(editedData); 

            this.Dialog.Hide(); 

} 

 

Please get the sample from below link. In this given sample, progress of the parent task is updated properly while updating the progress of child tasks. 

Sample: https://www.syncfusion.com/downloads/support/forum/158158/ze/Gantt-custom-dialog-1733547449 

Please let us know if you need any further details on this. 

Thanks, 

Gopinath M