Progress Telerik UI for Blazor

Blazor Filter

  • The Blazor Filter component  allows users to quickly build filter expressions using a point-and-click approach. The filtering rules and expressions and can be applied to any data-bound component such as the Grid, ListView and TreeList.
  • This component is part of the largest truly native Blazor component suite - Telerik UI for Blazor designed to perfectly fit in any app’s requirement.
  • The Blazor UI suite also comes with professionally designed themes enabled with a flip of a switch, document processing library, rich docs & demos to help you get started in no time.
Telerik UI for Blazor Suite
Nasa, Visa, Microsoft Fox, Samsung, IBM World Bank Group, Volvo
  • Overview

    The Blazor Filter component (also known as a query builder) allows users to build filter expressions using a point-and-click approach. The filtering rules can contain multiple logical operators and expressions and can be applied to any data-bound component such as the Grid, ListView and TreeList.

    See Blazor Filter UI component example.

    Telerik UI for Blazor Filter Component
  • Filter Operators

    You can configure the Blazor Filter component by adding custom operators per field using the Operators parameter.

    See Blazor Filter Operators demo.

  • Expressions and Group of Expressions

    Using the Telerik UI for Blazor Filter, users can easily add and remove new expressions or groups of expressions with the provided built-in buttons.

    Telerik UI for Blazor Filter Component Expressions
  • Localization

    The Filter UI component comes with built-in localization of the logical AND & OR operators, the Close button of each group/filter and the Add Expression and Add Group texts. The translated text is available for customization through the Resource file.

    See how translated texts work in Blazor Filter.

  • Customization of the Filter Default Operator

    The DefaultOperator parameter of the Blazor Filter component allows you to customize the default filter operator on a per-field basis (the filter that is preselected each time you add a new field). If unassigned, the default operator will be set based on the data type. 

    See an example of custom filter operators in the Blazor Filter component.

  • Theming

    The Telerik Blazor Filter component has several built-in themes such as Default (our own styling), Material (based on the Material Design guidelines) and Bootstrap. You can easily customize any of out-of-the-box themes with a few lines of CSS, or create a new theme to match your colors and branding by using the Telerik SASS ThemeBuilder application.
    Telerik UI for Blazor Filter Component Built-in Themes

All Blazor Components

Next Steps

Launch demos

See Telerik UI for Blazor in action and check out how much it can do out-of-the-box.

Download free trial

Try Telerik UI for Blazor with dedicated technical support.