How to make the Blazor Grid Dialog resizable?

Answer:

To resize the Blazor DataGrid edit dialog use the EnableResize property. Here are the code snippets for reference.

<SfGrid DataSource="@Orders" AllowPaging="true" Toolbar="@(new List<string>() { "Add", "Edit", "Delete", "Update", "Cancel" })" Height="315">

<GridEditSettings AllowAdding="true" AllowEditing="true" AllowDeleting="true" Mode="EditMode.Dialog" Dialog="DialogParams">GridEditSettings>

<GridColumns>

<GridColumn Field=@nameof(Order.OrderID) HeaderText="Order ID" IsPrimaryKey="true" ValidationRules="@(new ValidationRules{ Required=true})" TextAlign="TextAlign.Right" Width="120">GridColumn>

. . .

GridColumns>

SfGrid>

@code{

public List Orders { get; set; }

private DialogSettings DialogParams = new DialogSettings { Width = "450px", Height = "550px", EnableResize = true }; //you can resize the dialog using this property

. . .

}



Loader.
Up arrow icon