带搜索功能的GridView控件

Demo代码下载

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

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; } }

希望对你有所帮助。

代码下载

带搜索功能的GridView控件相关推荐

android 带清除功能的输入框控件
今天,看到一个很好的自定义输入框控件,于是记录一下. 效果很好: 一,自定义一个类,名为ClearEditText package com.example.clearedittext;import a ...
Android 带清除功能的输入框控件ClearEditText,仿IOS的输入框
转载请注明出处http://blog.csdn.net/xiaanming/article/details/11066685 今天给大家带来一个很实用的小控件ClearEditText,就是在Andr ...
Android 带清除功能的输入框控件EditTextWithDel
记录下一个很实用的小控件EditTextWithDel,就是在Android系统的输入框右边加入一个小图标,点击小图标可以清除输入框里面的内容,由于Android原生EditText不具备此功能,所以 ...
【ASP.NET】第八课——GridView 控件的编辑功能优化，GridView控件中嵌套DropDownList控件
知识点:掌握 GridView 的编辑.高亮显示的功能 .GridView控件中嵌套DropDownList控件获取数据源. [ASP.NET]第七课--数据绑定和 GridView 控件的使用重点 ...
C# asp .net GridView控件基础操作详解
1.创建通过VS创建的.net aspx项目通过左栏工具箱搜索可以获得GridView控件. 2.基本操作单击控件右上角的扩展符号,获得扩展栏首先是配置数据源,数据源同样通过工具栏的SqlDat ...
GridView控件详解
GridView是ASP.NET 1.x的DataGrid控件的后继者.它提供了相同的基本功能集,同时增加了大量扩展和改进.如前所述,DataGrid(ASP.NET 2.0仍然完全支持)是一个功能非 ...
演练GridView控件显示目录图片
本博文,将带你学习使用GridView控件显示站点目录的图片.如果你已经学会怎样做图片缩略图:怎样应用接口来实现统一的属性,方法或函数:怎样动态加载用户控件,等等.就不必往下看了.因为此篇博文就是演练 ...
ASP.NET GridView控件常用功能
ASP.NET GridView控件常用功能一.分页显示二.排序数据三.实现全选和不全选四.对数据进行编辑操作五.删除数据六.高亮显示鼠标所在行七.设置数据显示格式八.单击控件某行按钮 ...
asp.net 中GridView控件实现全选及反选的功能
大家都知道邮箱里面有全部删除邮件的复选按钮,其实还是比较简单哈! 废话嘛!就不说那么多了,我先给大家讲哈功能的实现. 首先,拖一个GridView控件和SqlDataSource控件,配置数据源. 然 ...

带搜索功能的GridView控件

带搜索功能的GridView控件相关推荐

最新文章

热门文章