学步园

介绍:

我正在搜寻一种方法实现在ASP.NET GridView控件包含搜索框。我找不到一个完美的解决方案，决定自己去实现它。这里所以写出我的解决方案。

为什么使用这种方案？

您可以使用此种方案和实施行的表格过滤变得非常容易。搜索和过滤操作可以由公正处理的搜索事件引发。此外，该GridView还可以设置选项以显示行序列号，行的总数，并显示页眉和页脚即使没有行在GridView可用。 （默认情况下，页眉和页脚是隐藏,当GridView没有数据行。）

该解决方案

我做了什么

1.我扩展GridView和创建了一个SearchableGridView类。
2.添加了一个TemplateColumn显示行数。

3. 在页脚,添加了控件来处理搜查事件。
4.当开启搜索的时候,，传递搜索字符串给触发的事件。

代码：

1、通过创建了一个SearchableGridView来扩展GridView，实现在Gridview的页脚有一个搜索框.

在SearchableGridView类中，我重写的OnInit函数添加模板的第一列显示的行序号，如果ShowRowNumber标记将被打开。

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

当每一行创建时,该OnRowCreated方法被执行。在此期间时，对创建的行类型的不同，在表尾,我们添加搜索控件和显示行数量label，在表身,添加行数，在表头,该添加列标题。

Code
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();
            }
        }
    }
}

该SearchableGridView的SearchFilters属性设置的搜索选项的下拉列表的值。它的Text属性对应的显示名称在DropDownList和列表项的值属性是数据源的列名。

现在，让我们进入到搜索的事件处理。为此，我创建了一个委托和事件SearchGrid，搜索按钮时被击中。搜索字符串形成使用语法_ddlFinder.SelectedValue + " like '" + _tbSearch.Text.Trim() + "%'".

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

显示页脚时,当没有返回任何行
GridView的默认属性是隐藏的页眉和页脚时没有行被绑定到它。设置一个空项目模板只可以显示模板而不是页眉或页脚。在我们的情况，页脚，必须始终显示，不论绑定到SearchableGridView行数，因为搜索选项应该是可见的。要做到这一点，我不得不重写CreateChildControls方法如下：

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

例子:
让我用一个例子帮助说明上面的控件。为此，我使用Northwind数据库中的客户表。

步骤1：创建与选择查询数据源dsCustomers：“SELECT CustomerID, CompanyName, Address, City, Country