@inject IJSRuntime js

@using Telerik.DataSource

<TelerikButton ThemeColor="primary" OnClick="@SetGridFilter">set filtering from code</TelerikButton>

<TelerikGrid Data="@MyData" Height="400px" @ref="@Grid"
             Pageable="true">
    <GridToolBarTemplate>
        <GridSearchBox Class="search-box" />
    </GridToolBarTemplate>
    <GridColumns>
        <GridColumn Field="@(nameof(SampleData.Id))" Width="120px" />
        <GridColumn Field="@(nameof(SampleData.Name))" Title="Employee Name" />
        <GridColumn Field="@(nameof(SampleData.Address))" Title="Address" />
    </GridColumns>
</TelerikGrid>

@* Move script to a separate JS file in production *@
<script suppress-error="BL9992">
    function showX() {
        var input = document.querySelector(".search-box input");
        input.dispatchEvent(new Event('input', { bubbles: true, cancelable: true  }));
    }
</script>

@code {
    public TelerikGrid<SampleData> Grid { get; set; }

    async Task SetGridFilter()
    {
        GridState<SampleData> desiredState = new GridState<SampleData>()
        {
            SearchFilter = CreateSearchFilter()
        };

        await Grid.SetStateAsync(desiredState);
        await js.InvokeVoidAsync("showX");
    }

    private IFilterDescriptor CreateSearchFilter()
    {
        var descriptor = new CompositeFilterDescriptor();
        var fields = new List<string>() { "Name", "Address" };
        var searchValue = "name 10";
        descriptor.LogicalOperator = FilterCompositionLogicalOperator.Or;

        foreach (var field in fields)
        {
            var filter = new FilterDescriptor(field, FilterOperator.Contains, searchValue);

            filter.MemberType = typeof(string);

            descriptor.FilterDescriptors.Add(filter);
        }

        return descriptor;
    }

    public IEnumerable<SampleData> MyData = Enumerable.Range(1, 30).Select(x => new SampleData
    {
        Id = x,
        Name = "name " + x,
        Address = "address " + x % 5,
    });

    public class SampleData
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Address { get; set; }
    }
}