MudTable not two way binding?

Question

I'm fairly new with Blazor and MudBlazor and I have an odd issue I can't figure out. Not sure this would make a difference but just in case, I'm using Visual Studio 2022 17.1.3. I have a MudTable that displays a list of objects. I want to do basic CRUD operations and I'm having issues with the delete. My logic is fairly straight forward, when clicking on the delete button it will pop up a MudDialog for confirming the deletion. If you click on Delete button in the dialog it calls my DeleteUser function passing in the ID so I can delete and then the Name which is used in the confirmation message. When I go through the process and debug all looks like it should. I get the ID and name, I can tell that the Delete button has been clicked, I can delete from the database, I can confirm the record count in my list is one value and then gets reduced by a record after I remove it from the list, but after that the Dialog will go away and the MudTable still displays the the original records instead of showing the new list with the deleted record gone. The kicker is that if I click on a delete button again, the dialog pops up (and you can still see the table in the background) and then the first deleted record goes away which should have already happened. It's like the two-way binding piece is not working. What's really throws me on this is that it was working initially. So, maybe I've done something to make it not work but I'm not see anything that looks wrong.

I'm looking for any suggestions. I've spent several hours trying to figure this one out and have not made any progress.

<MudTable Items="@applications" Filter="new Func<AaApp, bool>(Search)" Hover="true" Bordered="true" Striped="true" Dense="true" >        
        <ToolBarContent>
            <a class="btn btn-sm btn-success" @onclick="(e => CreateAsync())" >
                <i class="fas fa-plus"></i> New
            </a>
            <MudSpacer />
            <MudTextField @bind-Value="searchString" Placeholder="Search for an Application..." Adornment="Adornment.Start" AdornmentIcon="@Icons.Material.Filled.Search" IconSize="Size.Medium" Class="mt-0"></MudTextField>
        </ToolBarContent>
        <HeaderContent>
            <MudTh>ID</MudTh>
            <MudTh>
                <MudTableSortLabel InitialDirection="SortDirection.Ascending" SortBy="new Func<AaApp, object>(x=>x.Name)">Application Name</MudTableSortLabel>
            </MudTh>
            <MudTh>Description</MudTh>
            <MudTh></MudTh>
        </HeaderContent>
        <RowTemplate>
            <MudTd DataLabel="ID">@context.Id</MudTd>
            <MudTd DataLabel="Application Name">@context.Name</MudTd>
            <MudTd DataLabel="Description">@context.Description</MudTd>
            <MudTd DataLabel="">
                <MudButton OnClick="@((e) => DeleteUser(@context.Id, @context.Name))" Variant="Variant.Filled" Color="Color.Error">Delete Records</MudButton>
            </MudTd>
        </RowTemplate>
        <PagerContent>
            <MudTablePager PageSizeOptions="new int[] { 5,10,25,50}" />
        </PagerContent>
    </MudTable>

@code {

    private string searchString = "";
    private List<AaApp> applications;
    private AaApp application = new(); 
    MudMessageBox msgBox { get; set; }


    private async void DeleteUser(int id, string name)
    {
        var msgText = "Are you sure you want to delete: <b>" + name + "</b>.";
        bool? result = await _dialogService.ShowMessageBox("Delete Confirmation",(MarkupString) msgText, yesText: "Delete", cancelText: "Cancel");

 
        if (result ?? false)
        {
            //delete from database
            db.DeleteApp(id);

            //Remove and re-sort list.  
            applications.RemoveAll(i => i.Id == id);
            applications = applications.OrderBy(a => a.Name).ToList();
        }

    }

    protected override async Task OnInitializedAsync()
    {
        applications = await db.GetApps();
    }

    private async Task CreateAsync()
    {
        var parameters = new DialogParameters();
        parameters.Add("application", new AaApp());

        var dialog = await _dialogService.Show<AddOrUpdateDialog>("Creat A New App", parameters).Result;

        if (dialog.Data != null)
        {
            AaApp newApp = dialog.Data as AaApp;

            db.InsertApp(newApp);

            NavigationManager.NavigateTo("Groups");
        }
    }

    private bool Search(AaApp app)
    {
        if (app.Name is not null && app.Name.Contains(searchString, StringComparison.OrdinalIgnoreCase))
        {
            return true;
        }
        return false;
    }
}

Answer 1

I tried your code without the MudDialog and it works fine. When I used the dialog I had the same result, so I called the StateHasChanged method and everything worked fine.

        applications.RemoveAll(i => i.Id == id);
        applications = applications.OrderBy(a => a.Name).ToList();
        StateHasChanged();