Filter Control
- 2 minutes to read
The FilterControlExtension allows end users to build complex filter criteria with an unlimited number of filter conditions, combined by logical operators, and apply them to extensions or data models.
Features
Custom Appearance
The following table provides API members you can use to customize the filter control’s appearance.
Element Property Combining operator FilterControlStyles.GroupType Add and Remove buttons FilterControlStyles.ImageButton Comparison operator FilterControlStyles.Operation Field name area FilterControlStyles.PropertyName Filter area FilterControlStyles.Table Filter criteria value FilterControlStyles.Value Filter Expression Validation
Use the ASPxClientFilterControl.IsFilterExpressionValid and FilterControlExtension.GetFilterExpressionInfo methods to get whether the filter criteria is valid. These methods check whether an end-user has entered the required criteria values and indicate whether or not it’s safe to apply the criteria. You can define validation settings for each column separately. See the Validation topic to learn more.
Client-Side APIs
The ASPxClientFilterControl object serves as the FilterControlExtension‘s client-side equivalent and provides client-side APIs.
Method Description ASPxClientFilterControl.Apply Applies the filter criteria. ASPxClientFilterControl.GetAppliedFilterExpression Gets the filter criteria that is applied to the associated extension. ASPxClientFilterControl.GetEditor Returns the editor used to edit the specified filter column’s operand values. ASPxClientFilterControl.GetFilterExpression Gets the filter criteria. ASPxClientFilterControl.IsFilterExpressionValid Specifies whether the filter criteria is valid. ASPxClientFilterControl.Reset Resets the current filter criteria and returns it to the associated extension’s filter expression.
Implementation
Use the FilterControl(MVCxFilterControlSettings) helper method to add the Filter Control (FilterControlExtension) extension to a view. The FilterControl(MVCxFilterControlSettings) method’s parameter provides access to the filter control’s settings (MVCxFilterControlSettings).
Declaration
The following code adds the filter control to a view.
View code (ASPX):
@{
Html.DevExpress().GridView<Product>(settings => {
settings.Name = "grid";
settings.CallbackRouteValues = new { Controller = "Editors", Action = "FilterControl_GridPartial" };
settings.Width = Unit.Percentage(100);
settings.Columns.Add(c => c.ProductName);
settings.Columns.Add(c => {
c.FieldName = "CategoryID";
c.Caption = "CategoryName";
});
settings.Columns.Add(c => c.Supplier.CompanyName);
...
}).Bind(Model).Render();
}
View code (Razor):
@{
Html.DevExpress().GridView<Product>(settings => {
settings.Name = "grid";
settings.CallbackRouteValues = new { Controller = "Editors", Action = "FilterControl_GridPartial" };
settings.Width = Unit.Percentage(100);
settings.Columns.Add(c => c.ProductName);
settings.Columns.Add(c => {
c.FieldName = "CategoryID";
c.Caption = "CategoryName";
});
settings.Columns.Add(c => c.Supplier.CompanyName);
...
}).Bind(Model).GetHtml();
}
Note
The Partial View should contain only the extension’s code.