MudBlazor - Blazor Component Library

Note

The Dialog is dependant on IDialogService and MudDialogProvider

Check the Installation page for instructions regarding default setup.

Usage

Suppose you define a MudDialog in TermsOfServiceDialog.razor. To show the dialog you simply call:

DialogService.Show<TermsOfServiceDialog>("Terms");

The advantage of having the dialog in its own Razor component is obviously the ability to reuse it throughout your code-base. You can pass parameters to your dialog on show which allow you to load the dialog with custom data.

Note: Even though it is technically possible to show any razor component as a dialog it is highly recommended to use a <MudDialog> as the top-level of your dialogs!

@inject IDialogService DialogService

<MudButton @onclick="OpenDialogAsync" Variant="Variant.Filled" Color="Color.Primary">
    Open Simple Dialog
</MudButton>

@code {

    private Task OpenDialogAsync()
    {
        var options = new DialogOptions { CloseOnEscapeKey = true };

        return DialogService.ShowAsync<DialogUsageExample_Dialog>("Simple Dialog", options);
    }
}

Configuration

The dialog's default behavior can be changed in two ways, either globally with parameters in the <MudDialogProvider/> or pass down the DialogOptions class when you open the dialog.

Dialog

API

Note

Usage

Configuration