Message Box

API

<MudMessageBox>

The MessageBox component uses IDialogService and MudDialogProvider for its functionality.

Global settings on MudDialogProvider affect all MessageBoxes in your app.

See the Dialog Configuration section for details on global dialog setup.

The easiest way to show a message box is with IDialogService.ShowMessageBox. This method displays a message box and waits for the user's response. You can control which buttons (Yes, No, Cancel) appear and their text. The result is a nullable bool: Yes = true, No = false, Cancel = null.

Message box hasn't been opened yet

<MudButton Variant="Variant.Filled" Color="Color.Error" OnClick="OnButtonClicked" >Delete</MudButton>

<MudChip T="string">@state</MudChip>

@code
{
    [Inject] private IDialogService DialogService { get; set; }

    string state = "Message box hasn't been opened yet";

    private async void OnButtonClicked()
    {
        bool? result = await DialogService.ShowMessageBoxAsync(
            "Warning", 
            "Deleting can not be undone!", 
            yesText:"Delete!", cancelText:"Cancel");
        state = result == null ? "Canceled" : "Deleted!";
        StateHasChanged();
    }
}

Custom Message Box

You can inline MudMessageBox in Razor to fully customize its appearance using render fragments. For example, you can change the color and icon of the Yes button, or customize the title and message using TitleContent and MessageContent.

Message box hasn't been opened yet

<MudButton Variant="Variant.Filled" Color="Color.Error" OnClick="OnButtonClickedAsync">Delete</MudButton>
<MudChip T="string">@_state</MudChip>

<MudMessageBox @ref="_mudMessageBox" Title="Warning" CancelText="Cancel">
    <MessageContent>
        Deleting can <b><i>not</i></b> be undone!
    </MessageContent>
    <YesButton>
        <MudButton Variant="Variant.Filled" Color="Color.Error" StartIcon="@Icons.Material.Filled.DeleteForever">Delete!</MudButton>
    </YesButton>
</MudMessageBox>

@code
{
    private MudMessageBox _mudMessageBox;
    private string _state = "Message box hasn't been opened yet";

    private async Task OnButtonClickedAsync()
    {
        bool? result = await _mudMessageBox.ShowAsync();
        _state = result is null ? "Canceled" : "Deleted!";
        StateHasChanged();
    }
}

Multiline Message

Use MarkupString for the message content to support multiline text or basic HTML styling. This is useful for highlighting parts of the message or displaying longer content without creating a custom dialog.

Message box hasn't been opened yet

<MudButton Variant="Variant.Filled" Color="Color.Info" OnClick="OnButtonClicked">I am Balrog</MudButton>

<MudChip T="string">@state</MudChip>

@code
{
    [Inject] private IDialogService DialogService { get; set; }

    string state = "Message box hasn't been opened yet";

    private async void OnButtonClicked()
    {
        bool? result = await DialogService.ShowMessageBoxAsync(
            "Secure The Ring", 
            (MarkupString) $"You <br /> Shall <br /> not <br /> <b>Pass!<b/>",
            yesText:"Fire Whip!", cancelText:"Smash Ground");
        state= result==null ? "Returned to Moria" : "Fighting With Gandalf!";
        StateHasChanged();
    }
}