Incorrect validation tooltip placement in datagrid
Hello!
I'm using the DataGrid control with column validation.
When adding the first two rows to an empty datagrid everything works as expected (1. pic) but from the third row and onward the validation tooltip is displayed incorrectly on top of the edited row (2. pic). I tried it in multiple project it always displayed that way.
What can I do to fix this?
Here is the code for the column (every column validation displayed this way not just this column) :
<GridColumn Field=@nameof(TestViewModel.TimeMinutes)
HeaderText="Time"
ValidationRules="@(new ValidationRules{ Required = false, Min = 1, Max = 59999 })"
Width="150">
<Template Context="timeContext">
@{
var data = timeContext as TestViewModel;
<div>@data.TimeMinutesH.ToString("##0"):@data.TimeMinutesM.ToString("00")</div>
}
</Template>
<EditTemplate Context="timeContext">
@{
var data = timeContext as TestViewModel;
<div>
<SfNumericTextBox @bind-Value="data.TimeMinutesH"
TValue="int"
Decimals="0"
Width="40%"
ShowClearButton="true"
ShowSpinButton="false"
Placeholder="Hours"
FloatLabelType="Syncfusion.Blazor.Inputs.FloatLabelType.Always"
Min="0"
Max="999"
Step="1">
</SfNumericTextBox>
:
<SfNumericTextBox @bind-Value="data.TimeMinutesM"
TValue="int"
Decimals="0"
Width="40%"
ShowClearButton="true"
ShowSpinButton="false"
Placeholder="Hours"
FloatLabelType="Syncfusion.Blazor.Inputs.FloatLabelType.Always"
Min="0"
Max="59"
Step="1">
</SfNumericTextBox>
</div>
}
</EditTemplate>
</GridColumn>
Thank you in advance.
Thanks for the quick response.
I think my print screen was a bit misleading sorry about that. There is plenty of available space for the tooltip.
Here you can see the tooltip was drawn above the edited cell even though there is space for it under the cell.
Also if I remove the aggregate row from the grid the tooltip placement changes. You can see in the picture that the tooltip is higher than in the picture in my last post.
Sometimes the a tooltip can block the underlying input field like this:
Hi!
In the same project that I attached earlier if I set the grid height property to 500px the following happens:
Also I would prefer not to explicitly set the grid height, in my use case auto height would be more desirable but again it looks like something is wrong with the component itself.
