Skip to main content
A newer version of this page is available. .

Filtering UI Context Designer

  • 3 minutes to read

The Filtering Model Configuration Wizard allows you to build and fine-tune your filtering Models and generated editors. To start this wizard, invoke the component’s smart-tag and select the corresponding link, as shown below.

FilteringUIContext - Invoke Wizard

The first wizard page lists all classes that can be used as filtering Models.

FilteringUIContext - Wizard Page 1

You can choose the existing Model or select “None”. The latter option is described below; for now, select an existing Model and click “Next” to proceed.

The second wizard page shows a list of public properties declared within a class you have selected previously. Each item in this list displays a check box, which you can use to specify whether or not the component should generate an editor for this specific property.

FilteringUIContext - Wizard Page 2

Editors on the right side of this wizard page affect the filtering editor that will be generated for the currently selected property. You can hover over each menu to view a detailed description for it.

  • Caption - text in this field will be used as the editor’s caption.
  • Editor Type - specifies the type of the generated filtering editor. You can choose from multiple options, which differ depending on the selected property type (string, integer, object, etc.). For instance, a boolean property can be filtered using a check box (default option), a combo box, a radio group or a toggle switch editor.
  • Description - here you can enter a string text that will be displayed by a filtering editor as a hint.

The Filtering Attributes topic demonstrates how to apply same changes in code by declaring attributes before filtering properties. The wizard does the same, but its generated attributes are stored within an external custom attributes collection. A filtering Model remains intact. If a filtering Model contains same attributes, they will have a lower priority compared to those from the custom collection.

Custom Filters

Along with modifying existing filtering Model properties and editors they will produce, the Filtering Model Configuration Wizard can filter data against custom data fields. In other words, you can filter data against properties that are not defined within a filter Model your Filtering UI Context component uses. To do so, click the “Add Custom Filter” on the wizard’s second page. When you select a custom property which appears in the list, two additional options will be enabled in addition to those caption, editor type and description options mentioned before.

  • Name - a name or a path to a data field associated with this property.
  • Data Type - gets or sets the type of your custom property. Depending on the type chosen, your options in the “Editor Type” menu will differ.

FilteringUIContext - Wizard Custom Filter

Adding custom filters will be your only option if you select ‘None’ on the first wizard page. This allows you to use the Filtering UI Context component without an external Model at all. Instead, the wizard writes all of your custom filtering attributes directly to your form’s designer class like in the sample below.


this.filteringUIContext1.CustomMetricAttributes.AddRange(new DevExpress.Utils.Filtering.CustomMetricsAttributeExpression[] {
new DevExpress.Utils.Filtering.CustomMetricsAttributeExpression("Model", typeof(string), new DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>[] {
            ((DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>)(new DevExpress.Utils.Filtering.FilterLookupAttributeInfo(DevExpress.Utils.Filtering.LookupUIEditorType.List, null, null, null)))}),
new DevExpress.Utils.Filtering.CustomMetricsAttributeExpression("Price", typeof(int), new DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>[] {
            ((DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>)(new DevExpress.Utils.Filtering.FilterRangeAttributeInfo(DevExpress.Utils.Filtering.RangeUIEditorType.Range, null, null, null, null)))}),
new DevExpress.Utils.Filtering.CustomMetricsAttributeExpression("InStock", typeof(bool), new DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>[] {
            ((DevExpress.Utils.Filtering.IAttributeInfo<System.Attribute>)(new DevExpress.Utils.Filtering.FilterBooleanChoiceAttributeInfo(DevExpress.Utils.Filtering.BooleanUIEditorType.Check, null, null)))})});

If needed, these attributes can later be manually modified in code or you can simply re-run the wizard to re-configure your custom filters.