New help saving data in Mudblazor dialog

Question

Here's my code:

@inject IThemeService ThemeService
@inject ISnackbar Snackbar

<MudDialog Style="min-width: 500px;">
    <TitleContent>
        <MudText Typo="Typo.h6">
            @if (@theme.Id == 0)
            {
                <MudIcon Icon="@Icons.Material.Filled.AddBox" Class="mr-3 mb-n1" />
                <span>Add a Theme?</span>
            }
            else
            {
                <MudIcon Icon="@Icons.Material.Filled.AddBox" Class="mr-3 mb-n1">Edit Theme?</MudIcon>
                <span>Edit a Theme?</span>
            }
        </MudText>
    </TitleContent>
    <DialogContent>
        <MudTextField Value="@theme.Id.ToString()" Label="Theme ID" ReadOnly="true" />
        <MudTextField Value="@theme.Title" Label="Theme Name" />
    </DialogContent>
    <DialogActions>
        <MudButton OnClick="Cancel">Cancel</MudButton>
        <MudButton Color="Color.Error" OnClick="SaveTheme">Save Theme</MudButton>
    </DialogActions>
</MudDialog>

@code {
    [CascadingParameter] MudDialogInstance MudDialog { get; set; }
    [Parameter] public Theme theme { get; set; } = new Theme();

    private void Cancel()
    {
        MudDialog.Cancel();
    }

    private async void SaveTheme()
    {
        if (theme.Id == 0)
        {
            await ThemeService.CreateTheme(theme);
            Snackbar.Add("Theme Created!", Severity.Success);
        }
        else 
        {
            await ThemeService.UpdateTheme(theme);
            Snackbar.Add("Theme Updated!", Severity.Success);
        }

        MudDialog.Close(DialogResult.Ok(theme.Id));
        ThemeService.OnChange += StateHasChanged;
    }
}

Why would is not save the fields I enter in the dialog? It creates a new record in the db, but the Title field is empty.

Any help is appreciated!!

I'm no MudBlazor expert, but edit fields must work like normal Blazor fields. You are simply setting the value, not binding the Field to the model property. Check the MudBlazor documentation on using @bind-Value and the Ms-Docs documentation - learn.microsoft.com/en-us/aspnet/core/blazor/… — MrC aka Shaun Curtis
– MrC aka Shaun Curtis, Commented Mar 20, 2022 at 20:35

Caius Jard · Accepted Answer · 2022-03-21 08:05:19Z

0

Your binding is one way (from variable to page control). The simplest option for making it two way is to @bind

    <MudTextField @bind-Value="theme.Id" Label="Theme ID" ReadOnly="true" />
    <MudTextField @bind-Value="theme.Title" Label="Theme Name" />

answered Mar 21, 2022 at 8:05

Caius Jard

75k6 gold badges61 silver badges95 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

New help saving data in Mudblazor dialog

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related