Hi,
In most of my projects I use the ObjectGraphDataAnnotationsValidator component for validating complex types; and I also use a lot of your components. I've noticed what I *think* might be a clash between this validator and some of your input components. I've built a simple (and crude) example but I think it demonstrates the problem.
In the example code we have a table with 2 cells - in both cells we have an EditForm and 10 TelerikTextArea components. The first cell's EditForm contains a ObjectGraphDataAnnotationsValidator instance and the 2nd cell doesn't. Hopefully when you try to reproduce you will notice a distinct difference in performance with the performance of the 2nd EditForm being great, while the 1st EditForm is quite laggy and gets worse the more items you add.
I'm wondering if there is a clash here between the ObjectGraphDataAnnotationsValidator and the input components or I'm using them incorrectly?
Thanks
Michael.
@page "/"
<table width="100%">
<tr>
<td width="50%">
<h3>EditForm with ObjectGraphDataAnnotationsValidator</h3>
<EditForm Model="Items">
<ObjectGraphDataAnnotationsValidator />
@foreach (var item in Items)
{
<div style="display: flex">
<TelerikTextArea @bind-Value="item.TextValue" />
@if (Items.IndexOf(item) == (Items.Count - 1))
{
<TelerikButton OnClick="@(() => Items.Add(new DataItem()))">
Add
</TelerikButton>
}
</div>
}
</EditForm>
</td>
<td width="50%">
<h3>EditForm without ObjectGraphDataAnnotationsValidator</h3>
<EditForm Model="Items">
@foreach (var item in Items)
{
<div style="display: flex">
<TelerikTextArea @bind-Value="item.TextValue" />
@if (Items.IndexOf(item) == (Items.Count - 1))
{
<TelerikButton OnClick="@(() => Items.Add(new DataItem()))">
Add
</TelerikButton>
}
</div>
}
</EditForm>
</td>
</tr>
</table>
@code {
protected List<DataItem> Items { get; set; }
protected override void OnInitialized()
{
Items = new List<DataItem>();
for (var i = 1; i <= 10; i++)
{
Items.Add(new DataItem { TextValue = $"This is item number {i}." });
}
}
public class DataItem
{
public string TextValue { get; set; }
}
}