GridView中添加行单击事件.md

1.使用说明

1.方法来源

该方法主要参考StackOverflow上面的答案和下面这篇文章
http://www.codeproject.com/Articles/15677/Clickable-and-Double-Clickable-Rows-with-GridView

2.注意事项

引入行单击事件会覆盖掉原始的单击事件和双击事件,所以如果不是有特殊功能需求,使用前请慎重
如果仅仅是简单的单击改变行样式,最好使用其它方法
例如:http://blog.bossma.cn/dotnet/gridview-select-row-no-postback/ (使用javascript实现GridView无刷新选中行(变色))

3.原理

使用RowDataBound事件,添加并隐藏选择列,给每行添加点击事件


2.Code

1.前台

GridView列中添加选择列

<asp:CommandField HeaderText="选择" ShowSelectButton="True" />

GridView添加OnRowDataBound事件

OnRowDataBound="GridViewOrder_RowDataBound"

2.后台

RowDataBound事件

protected void GridViewOrder_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        if ((e.Row.RowState & DataControlRowState.Edit) != DataControlRowState.Edit)
        {
            // 隐藏选择列
            // 具体是Cells[n]看具体情况,也可以一开就把选择列甩在GridView的最开始
            GridViewOrder.HeaderRow.Cells[8].Visible = false;
            e.Row.Cells[8].Visible = false;
            //增加点击事件
            PostBackOptions myPostBackOptions = new PostBackOptions(this);
            myPostBackOptions.AutoPostBack = false;
            myPostBackOptions.RequiresJavaScriptProtocol = true;
            myPostBackOptions.PerformValidation = false;
            String evt = Page.ClientScript.GetPostBackClientHyperlink(sender as GridView, "Select$" + e.Row.RowIndex.ToString());
            e.Row.Attributes.Add("onclick", evt);
        }
    }
}

重写Render事件

/// <summary>
/// 重写了Render,使得Select按钮支持了不安全的postback
/// 使用时,只需要替换掉两个GridViewOrder即可
/// </summary>
/// <param name="writer"></param>
protected override void Render(HtmlTextWriter writer)
{
    foreach (GridViewRow r in GridViewOrder.Rows)
    {
        if (r.RowType == DataControlRowType.DataRow)
        {
            Page.ClientScript.RegisterForEventValidation(GridViewOrder.UniqueID, "Select$" + r.RowIndex);
        }
    }
    base.Render(writer);
}

SelectedIndexChanging事件
在里面可以写具体的单击事件代码

protected void GridViewOrder_SelectedIndexChanging(object sender, GridViewSelectEventArgs e)
{
    // 没有任何后台代码,仅通过前台的 SelectedRowStyle 配合实现了单击行更改样式的功能
}
posted @ 2016-05-16 16:30  只追昭熙  阅读(1799)  评论(0编辑  收藏  举报