Hi Brice,
Query: “The grid's height is bigger than the content height. && Just try resizing the dialog without heigth and the bug come back. ”
From your query we understand that you are facing issue with Grid Height not being adjusted into the Dialog content. By default Grid will be adjusted to browser element width and height. So if you want to adjust the Grid height and width to inside the dialog (container). We need to specify the Height and Width of Grid as 100% and static height and width to immediate parent of Grid’s div element. So we suggest you to define the static height to immediate parent element to Grid (refer the below code).
And also we suggest you to render the Grid only after the Dialog is displayed. We have modified the your sample to show the Dialog using @bind-Visible property instead of Show method.
Refer the below code example
|
<SfDialog @ref="@dialog"
IsModal=true ShowCloseIcon="true" AllowDragging=true EnableResize=true
Width="800px"
@bind-Visible="@visible">
<DialogTemplates>
<Content>
@{
if (visible) // render Grid after displaying the dialog
{
<div style="height:250px"> //static height to immediate parent
<SfGrid ID="SGrid" TValue="ExpandoObject" EnablePersistence="true"
AllowSorting="true" AllowPaging="true" AllowFiltering="true" AllowResizing=true EnableAltRow="true"
Width="100%" Height="100%">
<GridPageSettings PageSize="50" PageSizes="new int[] { 25, 50, 100, 250, 500 }" />
<GridColumns>
<GridColumn HeaderText="Test"></GridColumn>
</GridColumns>
</SfGrid>
</div>
}
}
</Content>
</DialogTemplates>
</SfDialog>
@code
{
SfDialog dialog;
public bool visible = false;
void OnClick()
{
visible = true;
}
}
|
For your convenience we have modified the sample which can be downloaded from below
Kindly get back to us if you have further queries.
Regards,
Indrajith
