Hello,
I am experiencing a crash when trying to remove a FilterField from a TelerikFilter component when using it inside a TelerikDialog. From what I understand, the documentation for the TelerikFilter is out of date ('TelerikFilter.ValueChanged' is obsolete: 'Use OnUpdate instead.') so I did my best trying to put the piece together.
The TelerikFilter code is based on the updated Telerik sample provided here: 'TelerikFilter.ValueChanged' is obsolete: 'Use OnUpdate instead.' but updated based on the documentation for "Filter in a Dialog" provided here: Blazor Dialog Integration - Telerik UI for Blazor
Here is my code:
<TelerikDialog @ref="@DialogRef" Visible="@ShowDialog" Width="600px" Title="My Dialog" VisibleChanged="@WindowVisibilityChangeHandler">
<DialogContent>
<TelerikFilter Value="@Value" OnUpdate="@((value) => OnFilterUpdate(value))">
<FilterFields>
<FilterField Name="@(nameof(Person.EmployeeId))" Type="@(typeof(int))" Label="Id"></FilterField>
<FilterField Name="@(nameof(Person.Name))" Type="@(typeof(string))" Label="First Name"></FilterField>
<FilterField Name="@(nameof(Person.AgeInYears))" Type="@(typeof(int))" Label="Age"></FilterField>
</FilterFields>
</TelerikFilter>
</DialogContent>
<DialogButtons>
<TelerikButton OnClick="@(() => ResetDialogState())">Cancel</TelerikButton>
<TelerikButton ThemeColor="@(ThemeConstants.Button.ThemeColor.Primary)" OnClick="@(() => PrimaryAction())">Confirm</TelerikButton>
</DialogButtons>
</TelerikDialog>@code {
private CompositeFilterDescriptor Value { get; set; } = new CompositeFilterDescriptor();
private void OnFilterUpdate(object filter)
{
if (filter is null)
{
return;
}
Value = (CompositeFilterDescriptor)filter;
DialogRef.Refresh();
}
public class Person
{
public int EmployeeId { get; set; }
public string Name { get; set; } = string.Empty;
public int AgeInYears { get; set; }
}
}The TelerikFilter renders fine and I can add Filters by clicking the "Add Expression" button. However, when I try to remove a filter that was added, I click on the X button on the right. The first time, nothing happens. When I click a second time, I get this error:
Unhandled exception rendering component: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')
System.ArgumentOutOfRangeException: Index was out of range. Must be non-negative and less than the size of the collection. (Parameter 'index')
at System.Collections.ObjectModel.Collection`1.RemoveAt(Int32 index)
at Telerik.Blazor.Components.Filter.FilterGroup.OnFilterRemove(Int32 index, String removedFilterId)
at Microsoft.AspNetCore.Components.ComponentBase.CallStateHasChangedOnAsyncCompletion(Task task)
at Microsoft.AspNetCore.Components.RenderTree.Renderer.GetErrorHandledTask(Task taskToHandle, ComponentState owningComponentState)I also have attached a video of the issue to this ticket.
Is this a bug? If not, can you point me in the right direction?
Thanks,
Mathieu