Version

Create a Custom Filter

Please note that this control has been retired and is now obsolete to the XamDataGrid control, and as such, we recommend migrating to that control. It will not be receiving any new features, bug fixes, or support going forward. For help or questions on migrating your codebase to the XamDataGrid, please contact support.

Before You Begin

The filter feature comes with a default set of filters, such as Greater Than and Equal To. However in some situations, you may want to expand this default set and add your own custom filters. This topic will demonstrate how to achieve this.

This walkthrough will also demonstrate how to display an icon next to your custom filter in the drop down menu.

This topic assumes that you already have the xamGrid™ control bound to data with filtering enabled; for more information, see the Data Binding and Filtering topics.

What You Will Accomplish

You will create a custom filter that displays all the products whose id is greater than 5.

Follow these Steps

  1. Create your own custom class that inherits from FilterOperand and name it GreaterThan5. The DefaultDisplayName method gets the string that will be displayed in the drop down menu for your custom filter. The RequiresFilteringInput method determines if the filter requires input to be applied to it or if it is standalone.

In Visual Basic:

Public Class GreaterThan5
   Inherits FilterOperand
   Protected Overrides ReadOnly Property DefaultDisplayName As String
      Get
         Return "Greater Than 5"
      End Get
   End Property
   Public Overrides ReadOnly Property RequiresFilteringInput As Boolean
      Get
         Return false
      End Get
   End Property
   ' Create filter expression that returns all products whose id is greater than 5
   Public Overrides Function FilteringExpression(ByVal value As Object) As System.Linq.Expressions.Expression
      Dim expr As System.Linq.Expressions.Expression
      ((Not (product) Is Nothing) _
      AndAlso (product.ProductID > 5))
      Return expr
   End Function
End Class

In C#:

public class GreaterThan5 : FilterOperand
{
   protected override string DefaultDisplayName
   {
      get
      {
         return "Greater Than 5";
      }
   }
   public override bool RequiresFilteringInput
   {
      get
      {
         return false;
      }
   }
   // Create filter expression that returns all products whose id is greater than 5
   public override System.Linq.Expressions.Expression FilteringExpression(object value)
   {
      System.Linq.Expressions.Expression<Func<Product, bool>> expr = product => product != null && product.ProductID > 5;
      return expr;
   }
}
  1. Add a data template to the resources tag. This data template will be displayed in the drop down menu next to your custom filter.

Note: The string value of this template that will be set to the Icon property cannot be longer than two characters.

In XAML:

<UserControl.Resources>
   <DataTemplate x:Key="GreaterThanFiveIcon">
      <StackPanel>
         <TextBlock Text="&gt;5" FontWeight="Bold" />
      </StackPanel>
   </DataTemplate>
</UserControl.Resources>
  1. In the code behind, create a member variable

In Visual Basic:

Dim _greaterThanFiveIcon As DataTemplate = Nothing

In C#:

// Member Variable
private DataTemplate _greaterThanFiveIcon = null;
  1. In the Loaded event, assign the data template to a member variable and add the new filter operand, GreaterThan5, to the RowFilterOperands collection on the ProductID column. Also set the Icon property to the new data template.

In Visual Basic:

' Assign the data template created in XAML
_greaterThanFiveIcon = CType(Me.Resources("GreaterThanFiveIcon"),DataTemplate)
Dim fcs As FilterColumnSettings = Me.MyDataGrid.Columns.DataColumns("ProductID").FilterColumnSettings
fcs.RowFilterOperands.Add(New GreaterThan5())

In C#:

// Assign the data template created in XAML
_greaterThanFiveIcon = this.Resources["GreaterThanFiveIcon"] as DataTemplate;
FilterColumnSettings fcs = this.MyDataGrid.Columns.DataColumns["ProductID"].FilterColumnSettings;
fcs.RowFilterOperands.Add(new GreaterThan5(){Icon = this._greaterThanFiveIcon});
  1. Save and run your application. You should see the operand and the icon in the drop down option for the ProductID column.

xamGrid Custom Filter 01.png