GridView/DataGrid 整行添加服务器事件

原创 2007年09月28日 14:41:00

需求说明

GridView/DataGrid 本身均支持行选择事件(通过设置Button/LinkButton.CommandName="Selected",并在 SelectedIndexChanged 事件中处理)。
然而,有时候我们希望用户点击 GridView/DataGrid 一行中任意位置都可以实现触发一个事件,并在服务端对此行进行相应处理,现在我们就实现此功能。

实现方式

这里我们采取的方法有点 "hack" :
通过客户端 javascript 引发行中隐藏的按钮(Button/LinkButton 均可以)的 click 事件。

主要代码

 

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="false" OnRowCommand="GridView1_RowCommand" OnRowDataBound="GridView1_RowDataBound">
            
<Columns>                              
                
<asp:TemplateField HeaderText="ProductName" >
                    
<ItemTemplate>
                        
<%Eval("ProductName"%>
                        
<asp:Button ID="btnHiddenPostButton" CommandName="HiddenPostButtonCommand" runat="server" Text="HiddenPostButton" style="display:none" />
                    
</ItemTemplate>
                
</asp:TemplateField>
                
<asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" />
            
</Columns>
        
</asp:GridView>

 

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
    
{
        Button btnHiddenPostButton 
= e.Row.FindControl("btnHiddenPostButton"as Button;
        
if (btnHiddenPostButton != null{
            e.Row.Attributes[
"onclick"= String.Format("javascript:document.getElementById('{0}').click()", btnHiddenPostButton.ClientID);
            
// 额外样式定义
            e.Row.Attributes["onmouseover"= "javascript:this.style.background='red'";
            e.Row.Attributes[
"onmouseout"= "javascript:this.style.background=''";
            e.Row.Attributes[
"style"= "cursor:pointer";
            e.Row.Attributes[
"title"= "单击选择当前行";
        }

        
// 若希望将隐藏按钮单独放于一列,则设置此列隐藏,占位符 <cellIndex> 表示此列索引
        
//e.Row.Cells[<cellIndex>].Attributes["style"] = "display:none";
    }


    
protected void GridView1_RowCommand(object sender, GridViewCommandEventArgs e)
    
{
        
int rowIndex = -1;
        GridViewRow row 
= null;
        
switch (e.CommandName) {            
            
case "HiddenPostButtonCommand"// 模板列                
                Control cmdControl = e.CommandSource as Control; // 表示触发事件的 IButtonControl,保持统一性并便于后续操作,我们这里直接转化为控件基类 Control
                row = cmdControl.NamingContainer as GridViewRow; // 当前行
                
// 如何访问单元格值
                
// string txt = row.Cells[0].Text;
                
// 如何获取模板列中的 Label
                
// string lbl = row.FindControl("MyLabelID") as Label;
                
// 执行更多的自定义操作
                
// 
                
// 
                Response.Write(String.Format("GridView Version 当前第 {0} 行:", row.RowIndex + 1));
                
break;
            
// case "Command2":
            
// more cases
            
//                 
        }

    }



测试效果



 

GridView/DataGrid行单击和双击事件实现代码_.Net教程

功能: 单击选中行,双击打开详细页面

GridView允许你通过EditIndex属性来修改数据的一行,同样也必须进行整行更新

介绍 在asp.net 中,GridView允许你通过EditIndex属性来修改数据的一行,同样也必须进行整行更新。 你可能不想对整行进行更新,并且常规更新是利用EditItemTemplate...

GridView模版列中动态添加事件

  • 2011年11月26日 21:37
  • 11KB
  • 下载

easyui datagrid 编辑状态时,为列添加文本改变事件

最近用到jQuery EasyUI 的时候在datagrid编辑状态的时候,输入值统计合计的时候没有文本改变事件. 所以特地加上了文本改变事件用于统计合计...easyui的版本是1.4.3 第一...
  • xnlzg
  • xnlzg
  • 2015年11月14日 23:11
  • 3190

EasyUI 给datagrid单元格添加onmouseover事件

1、前端网页代码,设置EasyUI的datagrid: tableid="tt"class="easyui-datagrid"style="width:700px;height:500px;font...

asp.net与JQuery EasyUi DataGrid 服务器端分页,添加增加,修改,删除 按钮

Html代码 background-color: #F4F4F4; overflow: hidden;"> 公司名称 查询 padding-left: 0; overflow: hidde...

自定义gridview添加行双击事件

无标题页 function yourfunction(obj){ for(var i=0;i
  • leek
  • leek
  • 2011年07月18日 12:42
  • 311

带添加按钮的GridView,item的删除事件

先上图片效果; gridView无数据时显示添加按钮,有数据时,第一格显示添加按钮,后面显示数据: 布局文件:addr_manage.xml xml version="1.0...

在GridView中添加按钮后,如何触发按钮的各种事件?

//在GridView中添加按钮后,如何触发按钮的各种事件? 1.在GridView的“编辑列”属性窗口中,增加新的Botton列。 2.然后再该窗口右边属性中,将外观项下的ButtonType设...
  • judyge
  • judyge
  • 2015年11月04日 11:41
  • 1010
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:GridView/DataGrid 整行添加服务器事件
举报原因:
原因补充:

(最多只允许输入30个字)