New to Telerik UI for ASP.NET Core? Download free 30-day trial

Telerik UI Filter in Razor Pages

Razor Pages are an alternative to the MVC pattern. Razor Pages make page-focused coding easier and more productive. This approach consists of a cshtml file and a cs file (generally, the two files have the same name). You can seamlessly integrate the Telerik UI Filter for ASP.NET Core in Razor Pages applications.

For a runnable example, refer to the Filter in RazorPages example.

Getting Started

To configure the Telerik UI Filter widget within a RazorPage:

  1. Configure the Read URL in the DataSource. The URL in these methods must refer to the method name in the PageModel:

                .Ajax(t =>
                    t.Model(model => model.Id(p => p.CustomerID));
            .Fields(f =>
            .FilterExpression(f => {
                f.Add(p => p.Position).IsEqualTo("Sales Representative");
  2. Add an AntiForgeryToken at the top of the RazorPage:

        @inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Xsrf
  3. Send the AntiForgeryToken with each POST request of the page. Additional parameters can also be supplied:

            function forgeryToken() {
                return kendo.antiForgeryTokens();
  4. Within the .cs file, introduce ActionMethod for the Read operation

        public JsonResult OnPostCustomers([DataSourceRequest]DataSourceRequest request)
            return new JsonResult(Customers.ToDataSourceResult(request)); // Where Customers is a colection of objects 

See Also

In this article