This article demonstrates how to use the Dialog component. Check also the component guide and API reference.

  1. Register <RadzenDialog /> in your application main layout.
  2. Register DialogService in your application Startup or Program.
  3. Inject DialogService in your page.
  4. Execute Open<T>() or OpenAsync<T>() method of the dialog service with desired page/component type as generic argument. Optionally you can provide dialog parameters, options, etc.

Blazor declaration

@inject DialogService dialogService
<RadzenButton Text=@($"Show OrderID: {orderID} details") Click="@(args => dialogService.Open<DialogCardPage>($"Order {orderID}",
                        new Dictionary<string, object>() { { "OrderID", orderID } },
                        new DialogOptions(){ Width = "700px", Height = "530px", Left = "calc(50% - 350px)", Top = "calc(50% - 265px)" }))" />