UI not updating after resetting object

40 Views Asked by At

For context, this is a standalone WebAssembly Blazor app.

I have a table from MudBlazor (shortened for readability):

<MudTable Items="@Items"
          @bind-SelectedItem="_selectedItem"
          CanCancelEdit="true"
          OnCommitEditClick="@(() => ItemChangeCommitted())"
          RowEditPreview="BackupItem"
          RowEditCancel="ResetItemToOriginalValues"
/>

When canceling an edit, the reset method gets called (there are more properties, but showing just one to avoid wall of text):

    private void ResetItemToOriginalValues(object? item)
    {
        item.Name = _itemBeforeEdit!.Name;
        StateHasChanged();
    }

Now the reset method can also be called another way, and that is when the user confirms a change they get prompted with a message box asking them to confirm. If they abort the change, the item should also reset:

    private async Task ItemChangeCommitted()
    {
        var result = await DialogService.ShowMessageBox(
            "Warning", 
            "Your changes may have consequences, are you sure you want to proceed?", 
            yesText:"Yes", cancelText:"Cancel");
        if (result == null || !result.Value)
        {
            ResetItemOriginalValues(_selectedItem);
            return;
        }
        await HttpClient.PutAsJsonAsync(ApiRoutes.UpdateItem(_selectedItem));

        StateHasChanged();
    }

However the GUI does not get updated after clicking "Cancel" on the message box prompt. It does get updated when cancelling the inline edit. I have tried making the methods async and awaiting them, but to no avail. How can I make sure the GUI gets updated no matter how the operation gets cancelled?

0

There are 0 best solutions below