How to use external search button with Telerik ASP.NET Core Grid?

[Hamed]

I want to use [Telerik ASP.NET Core Grid](https://demos.telerik.com/aspnet-core/grid/index) with **a separated search panel** like the following image

[![enter image description here][1]][1]

How to bind an external search button and other text fields (filters) to enable search in the grid?

  [1]: https://i.stack.imgur.com/rhZhD.jpg

[Hamed]

See the below picture please 

https://i.stack.imgur.com/rhZhD.jpg

[Martin]

Hello, Hamed,

The search panel functionality is executed within the input event of the textbox. Every time a character is added or deleted, a filter expression is built and applied to the data source. To achieve an external search field,  I would recommend creating a custom textbox and executing a filter expression when a user types in it. Below is an example implementation of the function that will filter the Grid:

function filterGrid() {
        var searchFileld = $("#search"); // value of the custom textbox
        var searchValue= searchFileld.val();
        var grid = $('#grid').data('kendoGrid');
        var filterArray= new Array;

        filterArray.push({
            logic: "or",
            filters: [{
                field: "ShipName",
                operator: "contains",
                value: searchValue
            },
            {
                field: "ShipCity",
                operator: "contains",
                value: searchValue
            }]
        });
        grid.dataSource.filter(filterArray);
    }

I hope I was helpful. Let me know how that works for you.

Regards,
Martin
Progress Telerik