Search in C1FlexGrid - I

Introduction

C1FlexGrid is always the favorite choice for programmers while using Grid in their applications. C1FlexGrid is a powerful, full-featured grid which provides all the basic requirements from binding, displaying, Formatting, editing, printing, styling, searching etc to advanced features like Trees, Sorting, filtering, Merging, Masked editing, automatic data aggregation etc. Searching refers to finding an item with specified properties among a collection of items.

Background

Default search functionality of C1FlexGrid allows to search for entries in a column as a user types. For this, set the AutoSearch property to 'FromCursor' to begin the search from the current row or 'FromTop' to begin the search from the first scrollable row. Conversely, to disable the search, set the AutoSearch property to 'None', which is the default setting. Search style in Styles collection of C1FlexGrid is used to define the style used to paint the cell selected while auto-searching.

Although, the default search functionality fulfils the need of Search feature in Grid, yet human desire asks for more!

1. What if the user wants to have TextBox-like Search feature present with most of the editors, browsers and readers. This type of search allows users to type a value and automatically search for the cell containing that value.

For this, a possible implementation will include the use of a ‘Filter Parameter’ as mentioned in the documentation. Here, on typing any value in textbox filters the grid rows to show the rows that contains the search string in any column. This is really nice implementation but like I said, Human Desire never ends!

2. What if user doesn’t want to filter the rows and simply wants to highlight the cell containing the searched Text showing the whole grid.

Though seems complex but needless to memorize that we are working with C1FlexGrid, the most customizable, flexible and powerful control you have ever used in .Net. A good ergonomic choice would be loop through the elements of grid to search for searched string. If found, you can change its forecolor to distinguish the Search Results. This blog focuses on implementation of the second scenerio.

Implementation

The method implements a flexible search buffer that allows users to locate values by typing any part of the value. As mentioned in my previous blog, “OwnerDrawCell event allows you to override every visual aspect of the cell”. Here, OwnerDrawCell event of C1FlexGrid is fired in order to redraw the characters of cells in C1FlexGrid. To begin with, set Drawmode property of C1FlexGrid to ‘OwnerDraw’ so that the grid triggers OwnerDraw event.

      //To enable control to fire OwnerDrawCell Event  
      c1FlexGrid1.DrawMode = C1.Win.C1FlexGrid.DrawModeEnum.OwnerDraw;  

Each time, text to be searched is changed, OwnerDraw event is fired in order to redraw content of each cell in the grid. The cell which contains the searched text will be drawn with different ForeColor (Red in this case), instead of their default rendering.

void c1FlexGrid1_OwnerDrawCell(object sender, C1.Win.C1FlexGrid.OwnerDrawCellEventArgs e)  
 {  
   //Check if OwnerDrawCell used for Searching  
   if (_StartSearch)  
       {  
         //Getting content of cell  
         string CellContent = e.Text;  
         //Check whether cell contains the Text in TextBox  
         if (CellContent.Contains(tbSearchBox.Text))  
             {  
                SolidBrush brush = new SolidBrush(Color.Red);  
                Single x = 0;  
                //Traverse celltext and set ForeColor.  
                for (int i = 0; i < CellContent.Length; i++)  
                    {  
                      string character = CellContent[i].ToString();  
                      //Color the Text of Search Result with Red  
                      e.Graphics.DrawString(character, c1FlexGrid1.Font, brush, e.Bounds.X + x, e.Bounds.Y);  
                      //Next character needs to be shifted right;  
                      //depending on the space occupied by the previous character as per its FontSize/FontStyle  
                      x += (e.Graphics.MeasureString(character, this.c1FlexGrid1.Font)).Width - 3;  

                      //To restrict FlexGrid to draw default cell content  
                      e.Handled = true;  
                    }  
             }  
         }  
   //Whether Search completed throughout all cells of grid  
   if (e.Row == c1FlexGrid1.Rows.Count && e.Col == c1FlexGrid1.Cols.Count)  
        {  
          _StartSearch = false;  
        }  
 }  

A Boolean Flag ‘_StartSearch’ is used to differentiate between firing of OwnerDraw event manually or automatically.

Conclusion

The simple feature used to implement this behavior is “C1FlexGrid provides almost total control over rendering of its elements”. On typing any text in SearchBox, all instances of search text that appears in the Grid gets highlighted with Red ForeColor.

Working Sample

CS Sample VB Sample