Filter Field Editor|UI Control for ASP.NET AJAX, C#, VB.NET

Filter Field Editor in ASP.NET

Home > How to > Filter Field Editors

Using Kettic Filter component, developers can easily build complex and advanced filter expressions in no time. In the previous user manuals, we have introduced some importance client side events and expression types. In this tutorial, we are going to introduce to you six types of built-in field editors for this Filter control.

PerFilterBooleanFieldEditor

From its name you can easily tell that this field editor represents a Boolean field. For this type of field editor, you can some options listed such as EqualTo, NotEqualTo, IsNull and NotIsNull, etc, generally followed by a checkbox. The main function for this checkbox is to input the true or false filter value, which is decided based on the state that you have checked.

This filed editor is only used to filter fields with Boolean value type, so the only property you might use is DataType, which can be customized to get the type of the field filtered by this editor.

PerFilterNumericFieldEditor

As the name suggests, this field editor can be applied to denote a numeric field. Unlike a Boolean field, which has only true of false filter value, this field offers more options, but they are limited to numeric input. Due to this reason, you find more options for filter expressions, such as GreaterThan and LessThan, etc. Just keep in mind that this field editor accepts only numeric rendering and numeric data input.

PerFilterTextFieldEditor

If, besides numeric input, you need to enter other types of data for filtering, you can try this text field editor, which accepts any type of user input, both numeric and alphabetic. This type of field editor can render a standard textbox, which put not a single limitation on the user input. Using this field editor, you have the maximum number of options for filter expressions.

If you would like to use this field editor, the only property you need to customize is the TextBoxWidth, which can alter the width of the textbox in pixels.

PerFilterDateFieldEditor

There is something special about this field editor as it allows you to construct a filter targeting dates. Apart from the general filed name and option, it can add a date time picker so you can select a date to validate the user input, thus making sure that a valid date also acts as a filter value.

PerFilterMaskedTextBoxEditor

Using this field editor, you can allow your users to input values to filter Kettic MaskedTextBox component. Right now there are a few properties provided for customization, including Mask, DisplayMask, ProptChar as well as DisplayPrompChar, just to name a few.

PerDropDownEditor

A DropDown Editor, of course, allows a developer to easily filter from a dropdown by selecting pre defined values. Some of the supported property setting options includes DropDownType, DataTextField, DataValueField, and also DataSourceID.

Field Editor Sample Codes

Below is an example of ASPX demo codes for customizing Filter control field editor:

<kettic:PerFilter runat="server" ID="PerFilter1"              
                
                <FieldEditors>
                    <kettic:PerFilterTextFieldEditor FieldName="FirstName" DisplayName="First Name" DefaultFilterFunction="Contains">
                    </kettic:PerFilterTextFieldEditor>
                    <kettic:PerFilterMaskedTextBoxEditor FieldName="HomePhone" DisplayName="Home Phone"
                        Mask="(###) ###-####"
                        DisplayMask="(###) ###-####" DisplayPromptChar="_" PromptChar="#" />
                    <kettic:PerFilterDateFieldEditor FieldName="HireDate" DisplayName="Hire Date" PickerType="DatePicker" />
                    <kettic:PerFilterDropDownEditor FieldName="Country" DataTextField="Country" DataValueField="Country" />
                    <kettic:PerFilterNumericFieldEditor FieldName="Salary" DefaultFilterFunction="GreaterThan"
                        KeepNotRoundedValue="false"
                        DecimalDigits="0" />
                    <kettic:PerFilterBooleanFieldEditor FieldName="IsFired" DisplayName="Have Been Fired" />
                </FieldEditors>
            </kettic:PerFilter>

ASP.NET AJAX UI Controls