GridView控件数据行响应鼠标的单击和双击事件

为了让GridView的数据行可以响应鼠标的单击和双击事件，一般我们会在GridView的RowDataBound事件中给<tr>加上客户端代码，为了简化这个步骤，我们来扩展一下它。


控件开发
1、新建一个继承自GridView的类。

/**/ ///<summary>
///继承自GridView
///</summary>
[ToolboxData( @" <{0}:SmartGridViewrunat='server'></{0}:SmartGridView> " )]
public class SmartGridView:GridView
{
}

2、加两个属性，分别是单击行事件所对应的按钮的ID和双击行事件所对应的按钮的ID

private string _rowClickButtonID;
/**/ ///<summary>
///单击行事件所对应的按钮的ID
///</summary>
[Description( " 单击行事件所对应的按钮的ID " ),DefaultValue( "" ),Category( " 扩展 " )]
public virtual string RowClickButtonID
{
get{return_rowClickButtonID;}
set{_rowClickButtonID=value;}
}

private string _rowDoubleClickButtonID;
/**/ ///<summary>
///双击行事件所对应的按钮的ID
///</summary>
[Description( " 双击行事件所对应的按钮的ID " ),DefaultValue( "" ),Category( " 扩展 " )]
public virtual string RowDoubleClickButtonID
{
get{return_rowDoubleClickButtonID;}
set{_rowDoubleClickButtonID=value;}
}

3、新建一个JavaScriptConstant类，把我们要用到的javascript存在一个常量里

using System;
using System.Collections.Generic;
using System.Text;

namespace YYControls.SmartGridView
{
/**////<summary>
///javascript
///</summary>
publicclassJavaScriptConstant
{
internalconststringjsClickAndDoubleClick=@"<scripttype=""text/javascript"">
//<![CDATA[
varisDoubleClick=false;
functionyy_RowClick(id)
{
setTimeout(""yy_RowClickTimeout('""+id+""')"",300);
}
functionyy_RowClickTimeout(id)
{
if(isDoubleClick==false)
{
//执行ID所指按钮的click事件
document.getElementById(id).click();
}
isDoubleClick=true;
}
functionyy_RowDoubleClick(id)
{
if(isDoubleClick==true)
{
//执行ID所指按钮的click事件
document.getElementById(id).click();
}
isDoubleClick=true;
}
//]]>
</script>";
}
}

4、重写OnPreRender方法，注册上面那段客户端脚本

/**/ ///<summary>
///OnPreRender
///</summary>
///<paramname="e"></param>
protected override void OnPreRender(EventArgse)
{
base.OnPreRender(e);

if(!String.IsNullOrEmpty(RowClickButtonID)||!String.IsNullOrEmpty(RowDoubleClickButtonID))
{
if(!Page.ClientScript.IsClientScriptBlockRegistered("jsClickAndDoubleClick"))
{
Page.ClientScript.RegisterClientScriptBlock(
this.GetType(),
"jsClickAndDoubleClick",JavaScriptConstant.jsClickAndDoubleClick
);
}
}
}

5、重写OnRowDataBound以实现数据行响应鼠标的单击和双击事件的功能。主要是给<tr>加上客户端代码，用来调用某个按钮的click事件

/**/ ///<summary>
///OnRowDataBound
///</summary>
///<paramname="e"></param>
protected override void OnRowDataBound(GridViewRowEventArgse)
{
if(e.Row.RowType==DataControlRowType.DataRow)
{
if(!String.IsNullOrEmpty(RowClickButtonID)||!String.IsNullOrEmpty(RowDoubleClickButtonID))
{
//GridViewRow的每个TableCell
foreach(TableCelltcine.Row.Cells)
{
//TableCell里的每个Control
foreach(Controlcintc.Controls)
{
//如果控件继承自接口IButtonControl
if(c.GetType().GetInterface("IButtonControl")!=null&&c.GetType().GetInterface("IButtonControl").Equals(typeof(IButtonControl)))
{
if(!String.IsNullOrEmpty(RowClickButtonID))
{
//该按钮的ID等于单击行所对应的按钮ID
if(c.ID==RowClickButtonID)
{
//增加行的单击事件，调用客户端脚本，根据所对应按钮的ID执行所对应按钮的click事件
e.Row.Attributes.Add("onclick","javascript:yy_RowClick('"+c.ClientID+"')");
}
}

if(!String.IsNullOrEmpty(RowDoubleClickButtonID))
{
//该按钮的ID等于双击行所对应的按钮ID
if(c.ID==RowDoubleClickButtonID)
{
//增加行的双击事件，调用客户端脚本，根据所对应按钮的ID执行所对应按钮的click事件
e.Row.Attributes.Add("ondblclick","javascript:yy_RowDoubleClick('"+c.ClientID+"')");
}
}
}
}
}
}
}

base.OnRowDataBound(e);
}

控件使用
添加这个控件到工具箱里，然后拖拽到webform上，要实现行的单击事件则设置RowClickButtonID为行单击事件所对应的按钮的ID，要实现行的双击事件则设置RowDoubleClickButtonID为行双击事件所对应的按钮的ID。
ObjData.cs

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

using System.ComponentModel;

/**/ ///<summary>
///OjbData的摘要说明
///</summary>
public class OjbData
{
publicOjbData()
{
//
//TODO:在此处添加构造函数逻辑
//
}

[DataObjectMethod(DataObjectMethodType.Select,true)]
publicDataTableSelect()
{
DataTabledt=newDataTable();
dt.Columns.Add("no",typeof(string));
dt.Columns.Add("name",typeof(string));

for(inti=0;i<30;i++)
{
DataRowdr=dt.NewRow();
dr[0]="no"+i.ToString().PadLeft(2,'0');
dr[1]="name"+i.ToString().PadLeft(2,'0');

dt.Rows.Add(dr);
}

returndt;
}
}

Default.aspx

<% @PageLanguage="C#"AutoEventWireup="true"CodeFile="Default.aspx.cs"Inherits="_Default" %>

<! DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html xmlns ="http://www.w3.org/1999/xhtml" >
< head runat ="server" >
< title > SmartGridView测试 </ title >