Hello,
I have a Grid inside a TabItem of a EjsTab control and I would like to set Tabs and Grid height to the full height of the parent div.
Actually when there are a lot of rows the Grid height overflows the window height.
If I put the Grid outside the EjsTab it works as expected as the Grid resizes with the parent.
This is the Blazor component:
[CODE]
<div style="height:calc(100vh - 120px);">
@{
var filterContains = new { @@operator = "contains"};
}
<EjsTab CssClass="e-fill" OverflowMode="OverflowMode.Popup">
<TabItems>
<TabItem>
<ChildContent>
<TabHeader Text="HEADER"></TabHeader>
</ChildContent>
<ContentTemplate>
<EjsGrid @ref="datagrid" DataSource="@Source" AllowFiltering="true" AllowGrouping="true" AllowMultiSorting="true" AllowPaging="true" AllowResizing="true" AllowSelection="true" AllowSorting="true" GridLines="GridLine.Both" Height="100%" Width="100%">
<GridPageSettings PageSize="30" />
<GridColumns>
...
</GridColumns>
</EjsGrid>
</ContentTemplate>
</TabItem>
</TabItems>
</EjsTab>
</div>
[/CODE]
I tried changing the HeightAdjustMode of the EjsTab but I can't get it.
Is there a way to get the EjsTab with inside a Grid to fullfill and resizes with the parent div?
Thank you.