GridView/DataGrid行单击和双击事件实现代码_.Net教程
功能: 单击选中行,双击打开详细页面
说明:单击事件(onclick)使用了 setTimeout 延迟,根据实际需要修改延迟时间 ;当双击时,通过全局变量 dbl_click 来取消单击事件的响应
常见处理行方式会选择在 RowDataBound/ItemDataBound 中处理,这里我选择 Page.Render 中处理,至少基于以下考虑
1、RowDataBound 仅仅在调用 DataBind 之后才会触发,回发通过 ViewState 创建空件不触发 假如需要更多的处理,你需要分开部分逻辑到 RowCreated 等事件中
2、并且我们希望使用 ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法 进行安全脚本的注册,而后者需要在页的 Render 阶段中才能处理 .aspx(直接运行)
- <%@ Page Language="C#" %>
- <%@ Import Namespace="System.Data" %>
- <%--http://community.csdn.net/Expert/TopicView3.asp?id=5767096--%>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <script runat="server">
- protected void Page_Load(object sender, EventArgs e)
- {
- if (!IsPostBack) {
- LoadGridViewProductData();
- LoadDataGridProductData();
- }
- }
- protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
- {
- /*
- 当然可以在这里进行客户端脚本绑定,
- 但是,我选择在重载页的 Render 方法中处理,因为
- 1. RowDataBound 仅仅在调用 DataBind 之后才会触发,回发通过 ViewState 创建空件不触发
- 假如需要更多的处理,你需要分开部分逻辑到 RowCreated 等事件中
- 2. 并且我们希望使用
- ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法
- 进行安全脚本的注册,而后者需要在页的 Render 阶段中才能处理
- */
- }
- protected void DataGrid1_ItemDataBound(object sender, DataGridItemEventArgs e)
- {
- // 隐藏辅助按钮列
- int cellIndex = 0;
- e.Item.Cells[cellIndex].Attributes["style"] = "display:none";
- }
- void LoadGridViewProductData()
- {
- DataTable dt = CreateSampleProductData();
- GridView1.DataSource = dt;
- GridView1.DataBind();
- }
- void LoadDataGridProductData()
- {
- DataTable dt = CreateSampleProductData();
- DataGrid1.DataSource = dt;
- DataGrid1.DataBind();
- }
- #region sample data
- static DataTable CreateSampleProductData()
- {
- DataTable tbl = new DataTable("Products");
- tbl.Columns.Add("ProductID", typeof(int));
- tbl.Columns.Add("ProductName", typeof(string));
- tbl.Columns.Add("UnitPrice", typeof(decimal));
- tbl.Columns.Add("CategoryID", typeof(int));
- tbl.Rows.Add(1, "Chai", 18, 1);
- tbl.Rows.Add(2, "Chang", 19, 1);
- tbl.Rows.Add(3, "Aniseed Syrup", 10, 2);
- tbl.Rows.Add(4, "Chef Anton’s Cajun Seasoning", 22, 2);
- tbl.Rows.Add(5, "Chef Anton’s Gumbo Mix", 21.35, 2);
- tbl.Rows.Add(47, "Zaanse koeken", 9.5, 3);
- tbl.Rows.Add(48, "Chocolade", 12.75, 3);
- tbl.Rows.Add(49, "Maxilaku", 20, 3);
- return tbl;
- }
- #endregion
- protected override void Render(HtmlTextWriter writer)
- {
- // GridView
- foreach (GridViewRow row in GridView1.Rows) {
- if (row.RowState == DataControlRowState.Edit) { // 编辑状态
- row.Attributes.Remove("onclick");
- row.Attributes.Remove("ondblclick");
- row.Attributes.Remove("style");
- row.Attributes["title"] = "编辑行";
- continue;
- }
- if (row.RowType == DataControlRowType.DataRow) {
- // 单击事件,为了响应双击事件,需要延迟单击响应,根据需要可能需要增加延迟
- // 获取ASP.NET内置回发脚本函数,返回 __doPostBack(<<EventTarget>>, <<EventArgument>>)
- // 可直接硬编码写入脚本,不推荐
- row.Attributes["onclick"] = String.Format("javascript:setTimeout(\"if(dbl_click){{dbl_click=false;}}else{{{0}}};\", 1000*0.3);", ClientScript.GetPostBackEventReference(GridView1, "Select$" + row.RowIndex.ToString(), true));
- // 双击,设置 dbl_click=true,以取消单击响应
- row.Attributes["ondblclick"] = String.Format("javascript:dbl_click=true;window.open(’DummyProductDetail.aspx?productid={0}’);", GridView1.DataKeys[row.RowIndex].Value.ToString());
- //
- row.Attributes["style"] = "cursor:pointer";
- row.Attributes["title"] = "单击选择行,双击打开详细页面";
- }
- }
- // DataGrid
- foreach (DataGridItem item in DataGrid1.Items) {
- if (item.ItemType == ListItemType.EditItem) {
- item.Attributes.Remove("onclick");
- item.Attributes.Remove("ondblclick");
- item.Attributes.Remove("style");
- item.Attributes["title"] = "编辑行";
- continue;
- }
- if (item.ItemType == ListItemType.Item || item.ItemType == ListItemType.AlternatingItem) {
- //单击事件,为了响应双击事件,延迟 1 s,根据需要可能需要增加延迟
- // 获取辅助的支持回发按钮
- // 相对而言, GridView 支持直接将 CommandName 作为 <<EventArgument>> 故不需要辅助按钮
- Button btnHiddenPostButton = item.FindControl("btnHiddenPostButton") as Button;
- item.Attributes["onclick"] = String.Format("javascript:setTimeout(\"if(dbl_click){{dbl_click=false;}}else{{{0}}};\", 1000*0.3);", ClientScript.GetPostBackEventReference(btnHiddenPostButton, null));
- // 双击
- // 双击,设置 dbl_click=true,以取消单击响应
- item.Attributes["ondblclick"] = String.Format("javascript:dbl_click=true;window.open(’DummyProductDetail.aspx?productid={0}’);", DataGrid1.DataKeys[item.ItemIndex].ToString());
- //
- item.Attributes["style"] = "cursor:pointer";
- item.Attributes["title"] = "单击选择行,双击打开详细页面";
- }
- }
- base.Render(writer);
- }
- </script>
- <html xmlns="http://www.w3.org/1999/xhtml" >
- <head id="Head1" runat="server">
- <title>ASP.NET DEMO15: GridView 行单击与双击事件2</title>
- <script>
- // 辅助全局变量,指示是否双击
- var dbl_click = false;
- </script>
- </head>
- <body>
- <form id="form1" runat="server">
- <div>
- <h3>功能:</h3>
- <li>单击选中行</li>
- <li>双击打开详细页面</li>
- <h3>说明:</h3>
- <ul>
- <li>这是<a href="GridView/DataGrid http://www.cnblogs.com/Jinglecat/archive/2007/09/20/900645.html"> ASP.NET DEMO 15: 同时支持行单击和双击事件</a>的改进版本</li>
- <li>单击事件(onclick)使用了 setTimeout 延迟,根据实际需要修改延迟时间</li>
- <li>当双击时,通过全局变量 dbl_click 来取消单击事件的响应</li>
- <li>常见处理行方式会选择在 RowDataBound/ItemDataBound 中处理,这里我选择 Page.Render 中处理,至少基于以下考虑
- <li style="padding-left:20px; list-style-type:square">RowDataBound 仅仅在调用 DataBind 之后才会触发,回发通过 ViewState 创建空件不触发
- 假如需要更多的处理,你需要分开部分逻辑到 RowCreated 等事件中</li>
- <li style="padding-left:20px; list-style-type:square">并且我们希望使用
- ClientScript.GetPostBackEventReference 和 ClientScript.RegisterForEventValidation 方法
- 进行安全脚本的注册,而后者需要在页的 Render 阶段中才能处理</li>
- </li>
- <li>关于“DataGrid中采取的辅助按钮支持回发”见<a href="http://www.cnblogs.com/Jinglecat/archive/2007/07/15/818394.html">ASP.NET DEMO8: 为 GridView 每行添加服务器事件</a>
- </ul>
- <br />
- <input type="button" id="Button1" value="Rebind" onclick="location.href=location.href;" />
- <div style="float:left">
- <h3>GridView Version</h3>
- <asp:GridView ID="GridView1" DataKeyNames="ProductID" runat="server" AutoGenerateColumns="False" OnRowDataBound="GridView1_RowDataBound">
- <SelectedRowStyle BackColor="CadetBlue" />
- <Columns>
- <asp:TemplateField HeaderText="ProductName" >
- <ItemTemplate>
- <%# Eval("ProductName") %>
- </ItemTemplate>
- <EditItemTemplate>
- <asp:TextBox ID="txtProductName" runat="server" Text=’<%# Bind("ProductName") %>’ />
- </EditItemTemplate>
- </asp:TemplateField>
- <asp:BoundField DataField="UnitPrice" HeaderText="UnitPrice" />
- </Columns>
- </asp:GridView></div>
- <div style="float:left;padding-left:100px;">
- <h3>DataGrid Version</h3>
- <asp:DataGrid ID="DataGrid1" DataKeyField="ProductID" runat="server" AutoGenerateColumns="False" OnItemDataBound="DataGrid1_ItemDataBound">
- <SelectedItemStyle BackColor="CadetBlue" />
- <Columns>
- <asp:TemplateColumn>
- <ItemTemplate>
- <asp:Button ID="btnHiddenPostButton" CommandName="Select" runat="server" Text="HiddenPostButton" style="display:none" />
- </ItemTemplate>
- </asp:TemplateColumn>
- <asp:BoundColumn DataField="ProductName" HeaderText="ProductName" />
- <asp:BoundColumn DataField="UnitPrice" HeaderText="UnitPrice" />
- </Columns>
- </asp:DataGrid></div>
- </li>
- </div>
- </form>
- </body>
- </html>
GridView/DataGrid行单击和双击事件实现代码_.Net教程的更多相关文章
- 支持行单击、双击事件的GridView和DataList控件(译)
支持行单击.双击事件的GridView和DataList控件(译) 让GridView 和 DataList 控件响应鼠标单击.双击事件.并且,使用 ClientScript.Regi ...
- GridView 行单击或双击事件绑定
protected void gvTeacherTaskList_RowCommand(object sender, GridViewCommandEventArgs e) { if (e.Comma ...
- [转] Ext Grid (ExtJs)上的单击以及双击事件
例1: 1.双击 var cb = new Ext.grid.RowSelectionModel({ singleSelect:true //如果值是false,表明可以选择多行:否则只能选择一行 } ...
- 禁用CMFCRibbonApplicationButton的单击和双击事件
为了禁用CMFCRibbonApplicationButton的单击和双击事件,我重载了CMFCRibbonApplicationButton如下: 1. MyRibbonApplicationBut ...
- jquery处理单击和双击事件
今天做div点击时,需要用到同一div的单击和双击事件,出现问题如下 例子: Html <body> <div id="div_1">单击双击我</d ...
- Android 自定义View实现单击和双击事件
自定义View, 1. 自定义一个Runnable线程TouchEventCountThread , 用来统计500ms内的点击次数 2. 在MyView中的 onTouchEvent 中调用 上面 ...
- [Javasript] 同时实现单击和双击事件
在同一个元素上同时绑定单击和双击事件: JavaScript <script type="text/javascript"> var timer = 0; var de ...
- JS - 解决鼠标单击、双击事件冲突问题(原生js实现)
由于鼠标双击时每一次触发双击事件都会引起两次单击事件和一次单击事件,原生的js不提供专门的双击事件. 因为业务原因,双击和单机都绑定了不同的业务,在双击的时候又触发了单机,影响了页面的正常显示 出现问 ...
- unity3D 游戏物体同时绑定单击、双击事件
前言 在unity中我们常用的获取鼠标点击的方法有 在3D场景中,一般用在Update方法中,每一帧调用 void Update(){ )){ Debug.log("鼠标左键点击" ...
随机推荐
- Redis的简单动态字符串实现
Redis 没有直接使用 C 语言传统的字符串表示(以空字符结尾的字符数组,以下简称 C 字符串), 而是自己构建了一种名为简单动态字符串(simple dynamic string,sds)的抽象类 ...
- P2V之后的磁盘扩容新思路
背景: 原先的物理机环境多是若干块物理磁盘经过RAID卡进行了RAID5之后的虚拟磁盘组,这样我们在操作系统内看到的也就是一块完整的磁盘.我们会在上面进行分区,然后格式化后以便使用. Figure 1 ...
- 一个IT人的成长路
毕业四年多了,来深圳三年多了,经历了刚毕业的懵懂少年,成长为现在的成熟稳重青年.职场上,从刚毕业的小白,成长为现在可以成熟应对各种事情的老司机.经历过从初级研发工程师,到中级研发工程师,到高级研发工程 ...
- JDBC增加删除修改
一.配置程序--让我们程序能找到数据库的驱动jar包 1.把.jar文件复制到项目中去,整合的时候方便. 2.在eclipse项目右击"构建路径"--"配置构建路径&qu ...
- RabbitMQ + PHP (三)案例演示
今天用一个简单的案例来实现 RabbitMQ + PHP 这个消息队列的运行机制. 主要分为两个部分: 第一:发送者(publisher) 第二:消费者(consumer) (一)生产者 (创建一个r ...
- Javascript学习笔记
Javascript 2016年12月19日整理 JS基础 Chapter1 JS是一门运行在浏览器客户端的脚本编程语言,前台语言 组成部分 1. ECMAscript JS标准 2. DOM 通过J ...
- 彻底搞懂Javascript的“==”
本文转载自:@manxisuo的<通过一张简单的图,让你彻底地.永久地搞懂JS的==运算>. 大家知道,==是JavaScript中比较复杂的一个运算符.它的运算规则奇怪,容让人犯错,从而 ...
- [jquery]显示隐藏div标签的几种方法
1.$("#demo").attr("style","display:none;");//隐藏div $("#demo" ...
- Android AppBar
AppBar官方文档摘记 2016-6-12 本文摘自Android官方文档,为方便自己及其他开发者朋友阅读. 章节目录为"Develop > Training > Best P ...
- Linux上运行NET
今天尝试了下Ubuntu上运行NET程序,按照 https://github.com/aspnet/Home 的指引,一步一步来: 1.安装DNVM(原名KVM) Linux控制台下输入 curl - ...