# Explicit Column Filtering

## Content

FullTextFilterBehavior provides developers with comprehensive control to enable filtering operations on preferred columns. Columns can be explicitly included or excluded by using the <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">FilteredFields</span> or <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">MatchBooleans</span> properties to provide a cleaner and more relevant filtering experience for end-users.
![](https://docapp.mescius.io/DOCUMENT_SITE_LINK_PREFIX_HERE/document-site-files/images/3ca88af8-b501-48d7-a446-601c9251a2fb/ExplicitColumnFiltering.98f17d.gif?width=800)

### **<span id="6a9304fa-5c17-4f19-93d4-ae58a16fd69e" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="6a9304fa-5c17-4f19-93d4-ae58a16fd69e" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 32px;">K</span>ey Capabilities**

1. Explicit Column Inclusion by Field Name
    * Define which columns should be filterable by specifying a collection of field names using the <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">FilteredFields</span> property.
2. <span id="cdd6d1df-9124-4c43-a397-d41f4db7aa14" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="cdd6d1df-9124-4c43-a397-d41f4db7aa14" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">Dy</span>namic Filtering UI
    * The filtering UI automatically adjusts to show the fields specified using the <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">FilteredFields</span> property or based on column types.
3. <span id="56f4d391-8a2a-46c8-9369-0b094cfe664e" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="56f4d391-8a2a-46c8-9369-0b094cfe664e" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">De</span>fault Behavior
    * All fields are filterable by default when no explicit configuration is specified.
4. <span id="e8946c09-efee-496e-831b-42eb973969c1" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="e8946c09-efee-496e-831b-42eb973969c1" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">Im</span>proved End-User Experience
    * Users see only meaningful fields in filter lists, which leads to faster and more accurate data filtering.
5. <span id="60e9704b-75ba-47e7-b99b-38174288f0a7" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="60e9704b-75ba-47e7-b99b-38174288f0a7" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">Er</span>ror Handling
    * Excluding or including non-existent columns does not cause run-time errors, as the grid automatically ignores invalid configuration.

### <span id="8337277c-80c9-4e3b-bc6b-21a666dc1c37" data-mark-type="annotation" data-mark-annotation-type="inlineComment" data-id="8337277c-80c9-4e3b-bc6b-21a666dc1c37" data-prosemirror-content-type="mark" data-prosemirror-mark-name="annotation" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 32px;">Co</span>nfigure Filtering Capabilities

Configure **FullTextFilterBehavior** to filter only the specified text, numeric or Boolean columns

#### **1\. Add a Search Box and Filtering Options in XAML**

Include the necessary input controls and checkboxes for the filter options:

```xml
<input:C1TextBox x:Name="search" Placeholder="Enter text to search..." Margin="0,0,50,0"/>

<StackPanel Orientation="Horizontal" Grid.Row="1">
    <CheckBox x:Name="matchCaseCheckbox" Content="Match case" Margin="4"/>
    <CheckBox x:Name="matchWholeWordCheckBox" Content="Match whole word" Margin="4" />
    <CheckBox x:Name="treatSpacesAsAndOperator" Content="Treat Spaces As And Operator" Margin="4" IsChecked="True" />
    <CheckBox x:Name="matchNumbers" Content="Match Numbers" Margin="4" IsChecked="True"/>
    <CheckBox x:Name="matchBolleans" Content="Match Booleans" Margin="4" IsChecked="False"/>
</StackPanel>
```

#### **2\. Apply FullTextFilterBehavior to FlexGrid and Bind to Filter Options**

Apply the behavior to the <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">FlexGrid</span> and bind the properties to the controls defined in the previous step:

```xml
<grid:FlexGrid x:Name="GridView" Grid.Row="2" Margin="0,10,0,0" ItemsSource="{StaticResource SampleDatas}">
    <i:Interaction.Behaviors>
        <grid:FullTextFilterBehavior
            FilterEntry="{Binding ElementName=search}"
            FilteredFields="{x:Bind FilteredFields}"
            MatchBooleans="{Binding IsChecked, ElementName=matchBolleans}"
    </i:Interaction.Behaviors>
</grid:FlexGrid>
```

#### **3\. Specify Columns for Filtering Using C\#**

In the code-behind file, define and populate the <span class="code" spellcheck="false" data-prosemirror-content-type="mark" data-prosemirror-mark-name="code" style="box-sizing: content-box; margin: 0px; padding: 0px; transition: filter 0.5s ease-in-out; line-height: 25.6px;">FilteredFields</span> collection with the names of the columns that should support filtering:

```auto
public sealed partial class MainWindow : Window
{
    public IEnumerable<string> FilteredFields { get; }

    public MainWindow()
    {
        this.InitializeComponent();
        root.DataContext = new SampleData();

        // Include only relevant text/numeric columns
        FilteredFields = new[]
        {
            GridView.ColumnHeaders.Columns[0].ColumnName, // Name
            GridView.ColumnHeaders.Columns[1].ColumnName, // Country
            GridView.ColumnHeaders.Columns[2].ColumnName  // Optional numeric column
        };
    }
}
```

* Enter search terms in the search box.
* Verify that the data in preferred columns is filtered.