Filtering Data (using C1FlexGridFilter)

The C1FlexGrid ships with “extender assemblies” called C1.Silverlight.FlexGridFilter and C1.WPF.FlexGridFilter that provide Excel-style filtering. To use these assemblies, add them to your project and then create a C1FlexGridFilter object attached to an existing grid. For example:

C#	Copy Code
// create C1FlexGrid var flex = new C1FlexGrid(); // enable filtering on the grid var gridFilter = new C1FlexGridFilter(flex);

In addition, C1.Silverlight.FlexGrid.GroupPanel and C1.WPF.FlexGrid.GroupPanel assemblies are also provided for manipulating groups in C1FlexGrid control. We decided to use extender assemblies instead of adding the functionality directly to the control for two reasons:

It allows us to keep the grid assembly small and allows you to choose which extensions you want to use with each project.
It allows the functionality of C1FlexGrid to be extended through custom codes. The code samples ExcelBook and ExcelGrid supplied with WPF and Silverlight illustrate this functionality.

You can also enable filtering in the XAML file where the grid is declared. Here is the syntax for that:

XAML	Copy Code
<c1:C1FlexGrid Name="_flex" > <!-- add filtering support to the control: --> <c1:C1FlexGridFilterService.FlexGridFilter> <c1:C1FlexGridFilter /> </c1:C1FlexGridFilterService.FlexGridFilter> </c1:C1FlexGrid>

XAML

Copy Code

<c1:C1FlexGrid Name="_flex" >
  <!-- add filtering support to the control: -->
  <c1:C1FlexGridFilterService.FlexGridFilter>
    <c1:C1FlexGridFilter />
  </c1:C1FlexGridFilterService.FlexGridFilter>
</c1:C1FlexGrid>

Once filtering is enabled, the grid displays a drop-down icon when the mouse is over the column headers. The drop-down shows an editor that allows users to specify how to filter the data on the column. Users may choose between two types of filter:

Value filter: This filter allows users to select the values to display from a list.
Condition filter: This filter allows users to specify two conditions composed of an operator (greater than, less than, etc) and a parameter. The conditions themselves are combined with an AND or an OR operator.

The image below shows what the filters look like while being edited:

Value Filter: Users create the filter by selecting values from a list.

Condition Filter: Users create the filter by setting one or two conditions.

The default filter settings are adequate for most applications, but you may customize the filter in several ways.

Selecting the filter mode

The filter operates in two modes, determined by the setting of the UseCollectionView property.

If you set the filter's UseCollectionView property to false, rows that do not satisfy the filter are hidden (the filter sets their Visible property to false). In this mode, the filter has no effect on the row count. You can use this mode in bound and unbound grids.

If you set the filter's UseCollectionView property to true, then the filter applies to the data source instead (using the ICollectionView.Filter property). In this mode, changes to the filter affect the number of items exposed by the data source to the grid and to any other controls bound to the same data source. You can only use this filter in bound mode.

For example:

C#	Copy Code
// create C1FlexGrid var flex = new C1FlexGrid(); // enable filtering on the grid var gridFilter = new C1FlexGridFilter(flex); // filter at the data source level gridFilter.UseCollectionView = true;

Or, in XAML:

XAML	Copy Code
<c1:C1FlexGrid Name="_flex" > <!-- add filtering support to the control: --> <c1:C1FlexGridFilterService.FlexGridFilter> <c1:C1FlexGridFilter UseCollectionView=”True”/> </c1:C1FlexGridFilterService.FlexGridFilter> </c1:C1FlexGrid>

XAML

Copy Code

<c1:C1FlexGrid Name="_flex" >
  <!-- add filtering support to the control: -->
  <c1:C1FlexGridFilterService.FlexGridFilter>
    <c1:C1FlexGridFilter UseCollectionView=”True”/>
  </c1:C1FlexGridFilterService.FlexGridFilter>
</c1:C1FlexGrid>

Customizing the filter type for each column

By default, filters are enabled for every column. Columns that contain Boolean or enumerated data get a Value filter, and columns that contain other data types get Value and Condition filters.

You can use the FilterType property to change this behavior and specify the type of filter to enable for each column.

Specifying the filter type is important in scenarios where columns have a large number of unique values or when columns contain bindings that do not work with the filters.

For example, columns containing images cannot be filtered with Value or Condition filters. In this case, you would disable the filter by setting the FilterType property to None.

A grid containing several thousand items may have a unique ID column, which adds too many items to the Value filter, making it slow and not very useful. In this case, disable the Value filter by setting the FilterType property to Condition.

The code below shows how to accomplish this:

C#	Copy Code
// create C1FlexGrid var flex = new C1FlexGrid(); // enable filtering on the grid var gridFilter = new C1FlexGridFilter(flex); // disable filtering on the Image column var columnFilter = gridFilter.GetColumnFilter(flex.Columns[“Image”]); columnFilter.FilterType = FilterType.None; // disable value filtering on the ID column columnFilter = gridFilter.GetColumnFilter(flex.Columns[“ID”]); columnFilter.FilterType = FilterType.Condition;

Copy Code

// create C1FlexGrid
var flex = new C1FlexGrid();

// enable filtering on the grid
var gridFilter = new C1FlexGridFilter(flex);

// disable filtering on the Image column
var columnFilter = gridFilter.GetColumnFilter(flex.Columns[“Image”]);
columnFilter.FilterType = FilterType.None;

// disable value filtering on the ID column
columnFilter = gridFilter.GetColumnFilter(flex.Columns[“ID”]);
columnFilter.FilterType = FilterType.Condition;

Specifying filters in code

In most cases, users set the filters. But the ColumnFilter class exposes a full object model that allows developers to examine and modify the filter conditions using code.

For example, the code below applies a filter to the second column. The filter causes the grid to show items where the value in the second column contains the letter Z:

C#	Copy Code
// create C1FlexGrid var flex = new C1FlexGrid(); // enable filtering on the grid var gridFilter = new C1FlexGridFilter(flex); // get filter for the first column var columnFilter = gridFilter.GetColumnFilter(flex.Columns[0]); // create filter condition (Contains ‘Z’) var condition = columnFilter.ConditionFilter.Condition1; condition.Operator = ConditionOperator.Contains; condition.Parameter = "Z"; // apply the filter gridFilter.Apply();

Copy Code

// create C1FlexGrid
var flex = new C1FlexGrid();

// enable filtering on the grid
var gridFilter = new C1FlexGridFilter(flex);

// get filter for the first column
var columnFilter = gridFilter.GetColumnFilter(flex.Columns[0]);

// create filter condition (Contains ‘Z’)
var condition = columnFilter.ConditionFilter.Condition1;
condition.Operator = ConditionOperator.Contains;
condition.Parameter = "Z";

// apply the filter 
gridFilter.Apply();

Persisting filters

The C1FlexGridFilter class contains a FilterDefinition property that gets or sets the current filter state as an XML string. You can use this string to persist the filter state when the user quits the application, so you can restore it later.

You may also save several filter definitions and allow the user to select and then customize these pre-set filters. You can also save and restore filter definitions to streams using the SaveFilterDefinition and LoadFilterDefinition methods.

WPF Reference

C1FlexGridFilter Class

UseCollectionView Property

FilterDefinition Property

SaveFilterDefinition Method

LoadFilterDefinition Method

ColumnFilter Class

FilterType Property

FilterType Enumeration

Silverlight Reference

C1FlexGridFilter Class

UseCollectionView Property

FilterDefinition Property

SaveFilterDefinition Method

LoadFilterDefinition Method

ColumnFilter Class

FilterType Property

FilterType Enumeration