Overview

 
Product Name Category Company Name Contact Name Unit Price Units in Stock Quantity per Unit Discontinued
Chai
BeveragesExotic LiquidsCharlotte Cooper$18.003910 boxes x 20 bags
Chang
BeveragesExotic LiquidsCharlotte Cooper$19.001724 - 12 oz bottles
Aniseed Syrup
CondimentsExotic LiquidsCharlotte Cooper$10.001312 - 550 ml bottles
Chef Anton's Cajun Seasoning
CondimentsNew Orleans Cajun DelightsShelley Burke$22.005348 - 6 oz jars
Chef Anton's Gumbo Mix
CondimentsNew Orleans Cajun DelightsShelley Burke$21.00036 boxes
Grandma's Boysenberry Spread
CondimentsGrandma Kelly's HomesteadRegina Murphy$25.0012012 - 8 oz jars
Uncle Bob's Organic Dried Pears
ProduceGrandma Kelly's HomesteadRegina Murphy$30.001512 - 1 lb pkgs.
Northwoods Cranberry Sauce
CondimentsGrandma Kelly's HomesteadRegina Murphy$40.00612 - 12 oz jars
Mishi Kobe Niku
Meat/PoultryTokyo TradersYoshi Nagase$97.002918 - 500 g pkgs.
Ikura
SeafoodTokyo TradersYoshi Nagase$31.003112 - 200 ml jars
Queso Cabrales
Dairy ProductsCooperativa de Quesos 'Las Cabras'Antonio del Valle Saavedra$21.00221 kg pkg.
Queso Manchego La Pastora
Dairy ProductsCooperativa de Quesos 'Las Cabras'Antonio del Valle Saavedra$38.008610 - 500 g pkgs.
Konbu
SeafoodMayumi'sMayumi Ohno$6.00242 kg box
Tofu
ProduceMayumi'sMayumi Ohno$23.003540 - 100 g pkgs.
Genen Shouyu
CondimentsMayumi'sMayumi Ohno$16.003924 - 250 ml bottles
Pavlova
ConfectionsPavlova, Ltd.Ian Devling$17.002932 - 500 g boxes
Alice Mutton
Meat/PoultryPavlova, Ltd.Ian Devling$39.00020 - 1 kg tins
Carnarvon Tigers
SeafoodPavlova, Ltd.Ian Devling$63.004216 kg pkg.
Teatime Chocolate Biscuits
ConfectionsSpecialty Biscuits, Ltd.Peter Wilson$9.002510 boxes x 12 pieces
Sir Rodney's Marmalade
ConfectionsSpecialty Biscuits, Ltd.Peter Wilson$81.004030 gift boxes
Data grid with 77 rows and 8 columns
0 rows are selected

The DevExpress Blazor Filter Builder allows users to create complex filter criteria. This component uses our CriteriaOperator language and can be connected to any data-aware DevExpress Blazor component. In this demo, the Filter Builder is bound to the DevExpress Blazor Grid component (using the DxFilterBuilder.FilterCriteria property).

 Value Template

The DevExpress Blazor Filter Builder allows you to specify templates used for field values:

  • ValueDisplayTemplate — Customizes content and appearance of field value captions.
  • ValueEditTemplate — Allows you to replace an auto-generated value editor with custom content.

The templates implement the context parameter that includes DisplayText and Value properties.

This demo uses value-related templates for both the Owner field (to allow user input) and the Status field (to display values with icons).

 View Mode

The DevExpress Blazor Filter Builder allows you to display its built-in text editor to modify a filter condition (in addition to the interactive tree view). Use the ViewMode property to specify Visual or VisualAndText mode.

Check the Text Editor checkbox to activate VisualAndText mode and modify filter expressions in the text editor.

In VisualAndText mode, the Filter Builder supports Blazor form validation and allows you to obtain component edit context using the GetEditContext method (to apply validation rules if necessary).

This demo disables the Apply button when you enter an invalid filter expression into the text editor.

 Operator Customization

The DevExpress Blazor Filter Builder supports operator customization. Specify the GroupOperatorTypes property to limit available logical operators (used to combine filter conditions).

Use the CustomizeOperators event to customize filter operators (used to build filter conditions):

  • Manage built-in operator collections
  • Add custom criteria functions
  • Arrange operators into groups
  • Assign operators used by default for each data type
  • Customize operator captions and icons

This demo limits built-in filter operators used for Product Name and Country fields. You can also click checkboxes to display or hide inverse logical operators, custom functions, and operator groups.

Refer to the following topic for additional information: Filter Operators.

 Collection Fields and Aggregate Operators

The DevExpress Blazor Filter Builder allows you to define fields used to store object collections (the IsCollection property is true). For such fields, the component populates operator lists with aggregate functions (Exists, Count, Avg, Sum, Min, and Max). These functions calculate collection summaries and allow users to create filter conditions based on aggregated results.

This demo defines an Orders collection field.