Filter - Field Editors

(First Name Contains 'Nancy' OR Home Phone = '2065559482' OR Hire Date = '4/1/1992 12:00:00 AM' OR Country = 'Bulgaria' OR Salary > '9876' OR Have Been Fired = 'True')
  • And
  • Or
  • Not And
  • Not Or
  • Contains
  • DoesNotContain
  • StartsWith
  • EndsWith
  • EqualTo
  • NotEqualTo
  • GreaterThan
  • LessThan
  • GreaterThanOrEqualTo
  • LessThanOrEqualTo
  • Between
  • NotBetween
  • IsEmpty
  • NotIsEmpty
  • IsNull
  • NotIsNull
  • First Name
  • Home Phone
  • Hire Date
  • Country
  • Salary
  • Have Been Fired

FirstNameLastNameTitleCountryHomePhoneHireDateSalaryIsFired
NancyAvilonSales RepresentativeUSA (206) 555-9857 5/1/1992 12:00:00 AM7800False
JanetLeverlingSales RepresentativeUSA (206) 555-9482 8/1/1992 12:00:00 AM5000False
MargaretPeacockSales RepresentativeUSA (206) 555-3412 4/1/1992 12:00:00 AM900True
StevenBuchananPresidentUSA (206) 555-8122 5/1/1993 12:00:00 AM8765False
MichaelSuyamaVice PresidentUK (71) 555-4848 10/1/1993 12:00:00 AM65000True
RobertKingSales RepresentativeUK (71) 555-7773 10/1/1992 12:00:00 AM4400False
LauraCallahanSales RepresentativeUK (71) 555-5598 10/1/1994 12:00:00 AM9870False
AnneDodsworthSales RepresentativeSpain (349) 715-5598 3/1/1994 12:00:00 AM3333False
AndrewFullerSales RepresentativeAustria (43) 876-1189 11/1/1994 12:00:00 AM5000False
JohnSmithPresidentBulgaria (359) 123-5678  5000False
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This demo demonstrates all field editors that RadFilter presents by default:

  • RadFilterBooleanFieldEditor - this denotes a Boolean field. For a Boolean field, the filter list options are limited to EqualTo, NotEqualTo, IsNull and NotIsNull, followed by a checkbox, which would hold the true/false filter value, depending on its checked state.
  • RadFilterNumericFieldEditor - denotes a numeric field. It has more Filter options than the Boolean field, but the options are still limited to a numeric input - for example GreaterThan and LessThan. The input control, which is rendered is a numeric one, which limits the user input to numeric values only.
  • RadFilterTextFieldEditor - this field accepts any type of user input - alphabetical and numeric. It renders a standard textbox, which does not pose any restrictions on the user input. This filter type has the largest array of filter options.
  • RadFilterDateFieldEditor - this field allows the construction of a filter targeting dates. It renders a picker or date input control which facilitates the selection of a date\time, and validates the user input, to ensure that a valid date is passed as the filter value. Depending on the PickerType value the current filed editor instance will render RadDatePicker, RadDateTimePicker, RadTimePicker or RadDateInput.
  • RadFilterDropDownEditor - Represents an editor for populating predefined items to be filtered using a drop down control.
  • RadFilterMaskedTextBoxEditor - Represents an editor for filtering values using a RadMaskedTextBox control.

Another features enabled for the RadFilter in this demo: adding filter expressions dynamically, building filter expressions manually and reducing filter menu options.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.FilterExamplesCSharp.CustomEditors.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
  <script type="text/javascript" src="scripts.js"></script>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
  <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1"></telerik:RadAjaxLoadingPanel>
  <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" CssClass="demo-container">
    <div>
      <telerik:RadFilter RenderMode="Lightweight" runat="server" ID="RadFilter1"
        ExpressionPreviewPosition="Bottom"
        DefaultGroupOperation="Or"
        SharedCalendarMaxDate="11/01/1994"
        SharedCalendarMinDate="05/01/1992"
        OperationMode="ServerAndClient"
        OnApplyExpressions="RadFilter1_ApplyExpressions"
        OnExpressionItemCreated="RadFilter1_ExpressionItemCreated">
        <ClientSettings>
          <ClientEvents OnFilterCreated="FilterCreated" />
        </ClientSettings>
        <FieldEditors>
          <telerik:RadFilterTextFieldEditor FieldName="FirstName" DisplayName="First Name" DefaultFilterFunction="Contains"></telerik:RadFilterTextFieldEditor>
          <telerik:RadFilterMaskedTextBoxEditor FieldName="HomePhone" DisplayName="Home Phone"
            Mask="(###) ###-####"
            DisplayMask="(###) ###-####" DisplayPromptChar="_" PromptChar="#" />
          <telerik:RadFilterDateFieldEditor FieldName="HireDate" DisplayName="Hire Date" PickerType="DatePicker" />
          <telerik:RadFilterDropDownEditor FieldName="Country" DataTextField="Country" DataValueField="Country" />
          <telerik:RadFilterNumericFieldEditor FieldName="Salary" DefaultFilterFunction="GreaterThan"
            KeepNotRoundedValue="false"
            DecimalDigits="0" />
          <telerik:RadFilterBooleanFieldEditor FieldName="IsFired" DisplayName="Have Been Fired" />
        </FieldEditors>
      </telerik:RadFilter>
    </div>
    <br />
    <div>
      <telerik:RadGrid RenderMode="Lightweight" ID="RadGrid1" AllowPaging="True" runat="server" EnableLinqExpressions="false"
        AutoGenerateColumns="false" GridLines="None"
        OnNeedDataSource="RadGrid1_NeedDataSource">
        <MasterTableView>
          <Columns>
            <telerik:GridBoundColumn DataField="EmployeeID" DataType="System.Int32" HeaderText="EmployeeID"
              SortExpression="EmployeeID" UniqueName="EmployeeID" Visible="false">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="FirstName" HeaderText="FirstName" SortExpression="FirstName"
              UniqueName="FirstName">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="LastName" HeaderText="LastName" SortExpression="LastName"
              UniqueName="LastName">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Title" HeaderText="Title" SortExpression="Title"
              UniqueName="Title">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Country" HeaderText="Country" SortExpression="Country"
              UniqueName="Country">
            </telerik:GridBoundColumn>
            <telerik:GridTemplateColumn DataField="HomePhone" HeaderText="HomePhone" SortExpression="HomePhone"
              UniqueName="HomePhone">
              <ItemTemplate>
                <%# string.Format("{0:(###) ###-####}", Convert.ToInt64(Eval("HomePhone")))%>
              </ItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridBoundColumn DataField="HireDate" DataType="System.DateTime" HeaderText="HireDate"
              SortExpression="HireDate" UniqueName="HireDate">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="Salary" DataType="System.Boolean" HeaderText="Salary"
              SortExpression="Salary" UniqueName="Salary">
            </telerik:GridBoundColumn>
            <telerik:GridBoundColumn DataField="IsFired" DataType="System.Boolean" HeaderText="IsFired"
              SortExpression="IsFired" UniqueName="IsFired">
            </telerik:GridBoundColumn>
          </Columns>
        </MasterTableView>
      </telerik:RadGrid>
    </div>
  </telerik:RadAjaxPanel>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance

Help Us Improve

Was this example helpful?