[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Collapse]Get Started With Data Grid and Views
     [Expand]Appearance and Conditional Formatting
     [Expand]Data Editing
     [Expand]Hit Information
     [Expand]Data Binding and Working with Columns
     [Expand]Grid View - Columns, Rows and Cells
     [Expand]Banded Views
     [Expand]WinExplorer View
     [Expand]Tile View
     [Collapse]Filter and Search
       Tutorial: Column Filter Dropdowns
       Tutorial: Data Filtering Basics and Filter Panel Settings
       Tutorial: Excel-Style Custom Filter Dialog
       Tutorial: Filter Editor
       Tutorial: Filter Row
       Tutorial: Filtering and Locating Rows API
       Tutorial: Incremental Search
       Tutorial: Search/Find Panel
     [Expand]Split Presentation
     [Expand]Row Preview Sections
   [Expand]Data Binding
    Unbound Columns
   [Expand]Data Editing and Validation
   [Expand]Filter and Search
   [Expand]Focus and Selection Handling
    Format Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
    Split Presentation
    Row Preview Sections
   [Expand]Batch Modifications
    Hit Information
    Popup Menus
   [Expand]Save and Restore Layout
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Tutorial: Search/Find Panel

This walkthrough is a transcript of the Search/Find Panel video available on the DevExpress YouTube Channel.

The grid includes an Outlook-style Search Panel UI that allows end-users to easily filter the View by searching for text in all or specific columns. This tutorial will demonstrate the search string syntax and then will guide you through the key settings that affect panel behavior. Finally, you'll learn how to invoke or hide the panel in code.

Expanded Search Panel Basics

To invoke the Search Panel, press the CTRL+F shortcut. When an end-user types within the search box, the grid automatically searches for that text in all columns and filter the view.

Expanded Search Syntax


The search syntax depends on the following properties:

This tutorial assumes that the resulting records should contain any of the keywords in the query and words in the records should start with the keywords. See Find Panel Syntax for more information.

If you type in two words, such as "new vendor", the grid considers them as individual conditions and selects records that contain either "new" or "vendor".

To find records that contain both, type "+" before the second word. Similarly, you can type "-" to exclude records that contain a specific word.

You can combine different operators. Use "+" and "-" to select records that contain both "new" and "vendor", excluding records that contain "history".

To search for a string that contains a space character, you need to enclose this string in quotation marks.

To search against a specific column, type the first letters of the column's display name plus a colon character. Now the grid displays records containing "new" in the Status column.

If you add another column-specific condition, the grid joins them using the AND logical operator and displays records that match both of them. The same happens when you join a column-specific condition with the one applied to all columns: the result will contain records that satisfy both criteria.

Click Clear to display all records.

Expanded Search Panel Options

By default, when you hide the Search Panel by clicking the close button, the search string is cleared and all records are displayed. Close the application, expand the View's GridView.OptionsFind property and disable the ColumnViewOptionsFind.ClearFindOnClose option.

Run the application to see the result. Now the filter condition is not removed when hiding the search panel.

Open the Property Grid displaying the View's settings. Expand the View's GridView.OptionsFind property and disable the ColumnViewOptionsFind.AllowFindPanel option. This will prevent the Search Panel from being invoked by pressing the CTRL+F shortcut. Set the ColumnViewOptionsFind.AlwaysVisible property to true to always display the Search Panel without the close button, and thus, prevent the panel from being hidden by end-users.

By default, the ColumnViewOptionsFind.FindFilterColumns property is set to "*". That's why the grid searches in all visible columns. Assign Status to this property. The grid will select records that contain the search string only in the specified column. You can also specify two or more columns separated by semicolon.

The ColumnViewOptionsFind.FindDelay property specifies the time interval after you stopped typing and before the filter is applied.

For large datasets, it can be useful to set the ColumnViewOptionsFind.FindMode setting to FindMode.FindClick to prevent unnecessary updates. Now when you enter text into the Search Panel, nothing happens until you click the Find button or press the ENTER key to force the update.

You can also disable the ColumnViewOptionsFind.HighlightFindResults option to remove search result highlighting. You can change the prompt text within the search box by setting the ColumnViewOptionsFind.FindNullPrompt property. The ColumnViewOptionsFind.ShowClearButton and ColumnViewOptionsFind.ShowFindButton options allow you to hide the buttons.

Expanded Displaying and Hiding the Search Panel in Code

Switch to design time to implement Search Panel visibility control in code. In the button's Click event handler, check the Search Panel's visibility state using the View's ColumnView.IsFindPanelVisible property. If the panel is now visible, hide it by calling the ColumnView.HideFindPanel method; otherwise, use the ColumnView.ShowFindPanel method to display it.

Run the application. To change the Search Panel's visibility state, click the button.

Expanded See Also

Is this topic helpful?​​​​​​​