带搜索功能的GridView控件

Demo代码下载 

最近需要一个gridview能够有不错的搜索功能,最好还是个GridView的扩展控件以后可以直接使用。我试着在CSDN上搜了一下下面这两篇文章都是带Search功能的GridView。

http://blog.csdn.net/xiandawang/archive/2007/05/25/1625529.aspx

http://blog.csdn.net/xiandawang/archive/2007/05/25/1625529.aspx

但是它们不是很好。后来终于看到一个SearchGridview控件，挺不错的介绍给大家。

 

我这直接介绍一下它的实现吧。

1.       写了一个GridView的扩展控件SearchabbleGridView类。

2.       添加一个TemplateColumn列来显示数据的条数。

3.       在GridView的footer添加一个搜索功能。

4.       当点击那个搜索按钮时触发一个事件。

代码部分:

1.       GridView的扩展类:

public class SearchGridView : GridView

2.       创建一个模板列来显示每行记录的序列号。

       public class NumberColumn : ITemplate { public void InstantiateIn(Control container) { } }

3.       在SearchableGrivView中我重载了OnInite方法来添加序列号的列为GridView的第一列。这里有个标志位ShowRowNumber如果是true的话才显示序列号列。

       protected override void OnInit(EventArgs e) { base.OnInit(e); //If showrownumber option is turned on then add //the template column as the first column. if (!IsDesign() && ShowRowNumber) { TemplateField tmpCol = new TemplateField(); NumberColumn numCol = new NumberColumn(); tmpCol.ItemTemplate = numCol; // Insert this as the first column this.Columns.Insert(0, tmpCol); } }

4.       方法OnRowCreated在每一行被创建的时候会被调用。通过判断当前行的RowType可以在Footer中添加总的行数和搜索模块。

      protected override void OnRowCreated(GridViewRowEventArgs e) { base.OnRowCreated(e); if (!IsDesign()) //During Runtime { if (e.Row.RowType == DataControlRowType.Footer) { //If ShowFooter is set to true if (ShowFooter && e.Row.Cells.Count > 0) { //If TotalRows has to be shown if (ShowTotalRows) { e.Row.Cells[0].Text = ViewState[NO_OF_ROWS] + " Rows."; } if (e.Row.Cells[e.Row.Cells.Count - 1].Controls.Count == 0) { //Create the search control Table table = new Table(); table.Style.Add("width", "100%"); table.Style.Add("align", "right"); TableRow tr = new TableRow(); TableCell tc = new TableCell(); tc.Style.Add("align", "right"); tc.Style.Add("width", "100%"); //Populate the dropdownlist with the Ids //of the columns to be filtered if (_ddlFinder.Items.Count == 0) SetFilter(); _btnSearch.Width = 20; _btnSearch.Height = 20; _btnSearch.ImageAlign = ImageAlign.AbsMiddle; _btnSearch.AlternateText = "Search"; //Assign the function that is called when search button is clicked _btnSearch.Click += new ImageClickEventHandler(_btnSearch_Click); tc.Controls.Add(_ddlFinder); tc.Controls.Add(_tbSearch); tc.Controls.Add(_btnSearch); tr.Cells.Add(tc); table.Rows.Add(tr); _pnlSearchFooter.Controls.Add(table); e.Row.Cells[e.Row.Cells.Count - 1].Controls.Add(_pnlSearchFooter); } } } if (e.Row.RowType == DataControlRowType.Header) { // If ShowHeader is set to true and // If Row number has to be shown if (ShowRowNumber && ShowHeader) { e.Row.Cells[0].Text = "Sno"; } } else if (e.Row.RowType == DataControlRowType.DataRow) { if (ShowRowNumber) { //Set the row number in every row e.Row.Cells[0].Text = (e.Row.RowIndex + (this.PageSize * this.PageIndex) + 1).ToString(); } } } }

5.       SearchGridView的SearchFilters属性是用来给能够Search字段的下拉菜单来帮顶数据的。

       public void SetFilter() { _ddlFinder.Items.Clear(); //Copy the items to the dropdownlist foreach (ListItem li in SearchFilters) _ddlFinder.Items.Add(li); }

6.       现在我们看一下当Search事件发生时我们如何来操作的。这里创建了事件SearchGrid，当search按钮被点击时时它会触发。然后搜索字段的形式会如下:

_ddlFinder.SelectedValue + " like '" + _tbSearch.Text.Trim() + "%'".

       public delegate void SearchGridEventHandler(string _strSearch); public event SearchGridEventHandler SearchGrid; void _btnSearch_Click(object sender, ImageClickEventArgs e) { string sSearchText = ConstructSearchString(); OnSearchGrid(sSearchText); } protected string ConstructSearchString() { string _strText = _tbSearch.Text.Trim(); if (_strText == string.Empty) return string.Empty; return _ddlFinder.SelectedValue + " like '" + _strText + "%'"; } protected void OnSearchGrid(string _strSearch) { if (SearchGrid != null) { SearchGrid(_strSearch); } }

7.       重载CreateChildControls方法让footer显示当没有记录符合查询条件时。

protected override int CreateChildControls(System.Collections.IEnumerable dataSource, bool dataBinding) { int count = base.CreateChildControls(dataSource, dataBinding); // no rows in grid. create header and footer in this case if (count == 0 && (ShowEmptyFooter || ShowEmptyHeader)) { // create the table Table table = this.CreateChildTable(); DataControlField[] fields; if (this.AutoGenerateColumns) { PagedDataSource source = new PagedDataSource(); source.DataSource = dataSource; System.Collections.ICollection autoGeneratedColumns = this.CreateColumns(source, true); fields = new DataControlField[autoGeneratedColumns.Count]; autoGeneratedColumns.CopyTo(fields, 0); } else { fields = new DataControlField[this.Columns.Count]; this.Columns.CopyTo(fields, 0); } if (ShowEmptyHeader) { // create a new header row GridViewRow headerRow = base.CreateRow(-1, -1, DataControlRowType.Header, DataControlRowState.Normal); this.InitializeRow(headerRow, fields); // Fire the OnRowCreated event to handle showing row numbers OnRowCreated(new GridViewRowEventArgs(headerRow)); // add the header row to the table table.Rows.Add(headerRow); } // create the empty row GridViewRow emptyRow = new GridViewRow(-1, -1, DataControlRowType.EmptyDataRow, DataControlRowState.Normal); TableCell cell = new TableCell(); cell.ColumnSpan = fields.Length; cell.Width = Unit.Percentage(100); // respect the precedence order if both EmptyDataTemplate // and EmptyDataText are both supplied ... if (this.EmptyDataTemplate != null) { this.EmptyDataTemplate.InstantiateIn(cell); } else if (!string.IsNullOrEmpty(this.EmptyDataText)) { cell.Controls.Add(new LiteralControl(EmptyDataText)); } emptyRow.Cells.Add(cell); table.Rows.Add(emptyRow); if (ShowEmptyFooter) { // create footer row GridViewRow footerRow = base.CreateRow(-1, -1, DataControlRowType.Footer, DataControlRowState.Normal); this.InitializeRow(footerRow, fields); // Fire the OnRowCreated event to handle showing // search tool and total number of rows OnRowCreated(new GridViewRowEventArgs(footerRow)); // add the footer to the table table.Rows.Add(footerRow); } this.Controls.Clear(); this.Controls.Add(table); } return count; }   

如何使用这个控件呢。步骤如下:

1.       选择一个数据源。比如sqldatasource.

2.       拖入一个SearchableGridView然后设置属性看哪列需要搜索。

 

3.       添加两个隐藏字段hfSearchText和hfSort来存储搜索字段和排序字段。

4.       事件的代码完善。

     protected void SearchGridView1_SearchGrid(string _strSearch) { hfSearchText.Value = _strSearch; BindData(); } protected void SearchGridView1_Sorting(object sender, GridViewSortEventArgs e) { //If hfSort has the same value as before, //the sorting should be done in descending order if (hfSort.Value == e.SortExpression) hfSort.Value = e.SortExpression + " Desc"; else hfSort.Value = e.SortExpression; BindData(); } void BindData() { //hfSearchText has the search string returned from the grid. if (hfSearchText.Value != "") dsCustomers.SelectCommand += " where " + hfSearchText.Value; DataView dv = (DataView)dsCustomers.Select(new DataSourceSelectArguments()); //hfSort has the sort string returned from the grid. if (hfSort.Value != "") dv.Sort = hfSort.Value; SearchGridView1.DataSource = dv; try { SearchGridView1.DataBind(); } catch (Exception exp) { //If databinding threw exception b’coz current //page index is > than available page index SearchGridView1.PageIndex = 0; SearchGridView1.DataBind(); } finally { //Select the first row returned if (SearchGridView1.Rows.Count > 0) SearchGridView1.SelectedIndex = 0; } }

 

 希望对你有所帮助。

代码下载