扩展GridView控件(6) - 响应行的单击事件和双击事件

最新推荐文章于 2023-04-13 08:45:34 发布
最新推荐文章于 2023-04-13 08:45:34 发布
阅读量1.2k 收藏 1
点赞数
分类专栏： ASP.NET 2.0 文章标签： 扩展 string asp javascript server object

[源码下载]

扩展GridView控件(6) - 响应行的单击事件和双击事件

 

作者：webabcd


/*正式版的实现 开始*/
介绍
扩展GridView控件：
响应行的单击事件和双击事件，并在服务端处理

使用方法（设置属性）：
BoundRowClickCommandName - 行的单击事件需要绑定的CommandName
BoundRowDoubleClickCommandName - 行的双击事件需要绑定的CommandName


关键代码
单击
using System;
using System.Collections.Generic;
using System.Text;

using System.Web.UI.WebControls;
using System.Web.UI;

namespace YYControls.SmartGridViewFunction
{
    /** <summary>
    /// 扩展功能：响应行的单击事件
    /// </summary>
    public class RowClickFunction : ExtendFunction
    {
        List<string> _rowClickButtonUniqueIdList = new List<string>();

        /** <summary>
        /// 构造函数
        /// </summary>
        public RowClickFunction()
            : base()
        {

        }

        /** <summary>
        /// 构造函数
        /// </summary>
        /// <param name="sgv">SmartGridView对象</param>
        public RowClickFunction(SmartGridView sgv)
            : base(sgv)
        {

        }

        /** <summary>
        /// 扩展功能的实现
        /// </summary>
        protected override void Execute()
        {
            this._sgv.RowDataBoundCell += new SmartGridView.RowDataBoundCellHandler(_sgv_RowDataBoundCell);
            this._sgv.RenderBegin += new SmartGridView.RenderBeginHandler(_sgv_RenderBegin);
        }

        /** <summary>
        /// RowDataBoundCell
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="gvtc"></param>
        void _sgv_RowDataBoundCell(object sender, GridViewTableCell gvtc)
        {
            TableCell tc = gvtc.TableCell;

            foreach (Control c in tc.Controls)
            {
                IButtonControl ibc = c as IButtonControl;

                if (ibc != null && this._sgv.BoundRowClickCommandName == ibc.CommandName)
                {
                    // 300毫秒后响应单击事件的脚本（避免和双击事件冲突）
                    string js = this._sgv.Page.ClientScript.GetPostBackClientHyperlink(c, "");
                    js = js.Insert(11, "setTimeout(/"");
                    js += "/", 300)";

                    GridViewRow gvr = tc.Parent as GridViewRow;
                    Helper.Common.SetAttribute(gvr, "onclick", js, AttributeValuePosition.Last);

                    _rowClickButtonUniqueIdList.Add(c.UniqueID);
                }
            }
        }

        /** <summary>
        /// RenderBegin
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="writer"></param>
        void _sgv_RenderBegin(object sender, HtmlTextWriter writer)
        {
            foreach (string uniqueId in this._rowClickButtonUniqueIdList)
            {
                // 注册回发或回调数据以进行验证
                this._sgv.Page.ClientScript.RegisterForEventValidation(uniqueId);
            }
        }
    }
}

双击
using System;
using System.Collections.Generic;
using System.Text;

using System.Web.UI.WebControls;
using System.Web.UI;

namespace YYControls.SmartGridViewFunction
{
    /** <summary>
    /// 扩展功能：响应行的双击事件
    /// </summary>
    public class RowDoubleClickFunction : ExtendFunction
    {
        List<string> _rowDoubleClickButtonUniqueIdList = new List<string>();

        /** <summary>
        /// 构造函数
        /// </summary>
        public RowDoubleClickFunction()
            : base()
        {

        }

        /** <summary>
        /// 构造函数
        /// </summary>
        /// <param name="sgv">SmartGridView对象</param>
        public RowDoubleClickFunction(SmartGridView sgv)
            : base(sgv)
        {

        }

        /** <summary>
        /// 扩展功能的实现
        /// </summary>
        protected override void Execute()
        {
            this._sgv.RowDataBoundCell += new SmartGridView.RowDataBoundCellHandler(_sgv_RowDataBoundCell);
            this._sgv.RenderBegin += new SmartGridView.RenderBeginHandler(_sgv_RenderBegin);
        }

        /** <summary>
        /// RowDataBoundCell
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="gvtc"></param>
        void _sgv_RowDataBoundCell(object sender, GridViewTableCell gvtc)
        {
            TableCell tc = gvtc.TableCell;

            foreach (Control c in tc.Controls)
            {
                IButtonControl ibc = c as IButtonControl;

                if (ibc != null && this._sgv.BoundRowDoubleClickCommandName == ibc.CommandName)
                {
                    // 响应双击事件的脚本
                    string js = this._sgv.Page.ClientScript.GetPostBackClientHyperlink(c, "");

                    GridViewRow gvr = tc.Parent as GridViewRow;
                    Helper.Common.SetAttribute(gvr, "ondblclick", js, AttributeValuePosition.Last);

                    _rowDoubleClickButtonUniqueIdList.Add(c.UniqueID);
                }
            }
        }

        /** <summary>
        /// RenderBegin
        /// </summary>
        /// <param name="sender"></param>
        /// <param name="writer"></param>
        void _sgv_RenderBegin(object sender, HtmlTextWriter writer)
        {
            foreach (string uniqueId in this._rowDoubleClickButtonUniqueIdList)
            {
                // 注册回发或回调数据以进行验证
                this._sgv.Page.ClientScript.RegisterForEventValidation(uniqueId);
            }
        }
    }
}

/*正式版的实现 结束*/

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


控件开发
1、新建一个继承自GridView的类。
/** <summary>
/// 继承自GridView
/// </summary>
[ToolboxData(@"<{0}:SmartGridView runat='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>
    public class JavaScriptConstant
    {
        internal const string jsClickAndDoubleClick = @"<script type=""text/javascript"">
        //<![CDATA[
        var isDoubleClick = false;
        function yy_RowClick(id)
        {
            setTimeout(""yy_RowClickTimeout('""+id+""')"", 300);
        }
        function yy_RowClickTimeout(id)
        {
            if (isDoubleClick == false)
            {
                // 执行ID所指按钮的click事件
                document.getElementById(id).click();
            }
            isDoubleClick = true;
        }
        function yy_RowDoubleClick(id)
        {
            if (isDoubleClick == true)
            {
                // 执行ID所指按钮的click事件
                document.getElementById(id).click();
            }
            isDoubleClick = true;
        }
        //]]>
        </script>";
    }
}

4、重写OnPreRender方法，注册上面那段客户端脚本
        /** <summary>
        /// OnPreRender
        /// </summary>
        /// <param name="e"></param>
        protected override void OnPreRender(EventArgs e)
        {
            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>
        /// <param name="e"></param>
        protected override void OnRowDataBound(GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                if (!String.IsNullOrEmpty(RowClickButtonID) || !String.IsNullOrEmpty(RowDoubleClickButtonID))
                {
                    // GridViewRow的每个TableCell
                    foreach (TableCell tc in e.Row.Cells)
                    {
                        // TableCell里的每个Control
                        foreach (Control c in tc.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
{
    public OjbData()
    {
        //
        // TODO: 在此处添加构造函数逻辑
        //
    }

    [DataObjectMethod(DataObjectMethodType.Select, true)]
    public DataTable Select()
    {
        DataTable dt = new DataTable();
        dt.Columns.Add("no", typeof(string));
        dt.Columns.Add("name", typeof(string));

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

            dt.Rows.Add(dr);
        }

        return dt;
    }
}

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

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//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>
</head>
<body>
    <form id="form1" runat="server">
        <yyc:SmartGridView ID="SmartGridView1" runat="server" AutoGenerateColumns="False"
            DataSourceID="ObjectDataSource1" RowClickButtonID="btnTestRowClick" RowDoubleClickButtonID="btnTestRowDoubleClick">
            <Columns>
                <asp:BoundField DataField="no" HeaderText="序号" SortExpression="no" ItemStyle-Width="100px" />
                <asp:BoundField DataField="name" HeaderText="名称" SortExpression="name" ItemStyle-Width="100px" />
                <asp:BoundField DataField="no" HeaderText="序号" SortExpression="no" ItemStyle-Width="100px" />
                <asp:BoundField DataField="name" HeaderText="名称" SortExpression="name" ItemStyle-Width="100px" />
                <asp:BoundField DataField="no" HeaderText="序号" SortExpression="no" ItemStyle-Width="100px" />
                <asp:BoundField DataField="name" HeaderText="名称" SortExpression="name" ItemStyle-Width="100px" />
                <asp:TemplateField>
                    <footerstyle cssclass="hidden" />
                    <headerstyle cssclass="hidden" />
                    <itemstyle cssclass="hidden" />
                    <itemtemplate>
                        <asp:Button id="btnTestRowClick" runat="server" CommandName="RowClick" CommandArgument='<%# Container.DataItemIndex %>' />
                        <asp:Button id="btnTestRowDoubleClick" runat="server" CommandName="RowDoubleClick" CommandArgument='<%# Container.DataItemIndex %>' />
                    </itemtemplate>
                </asp:TemplateField>
            </Columns>
        </yyc:SmartGridView>
        <asp:ObjectDataSource ID="ObjectDataSource1" runat="server" SelectMethod="Select"
            TypeName="OjbData"></asp:ObjectDataSource>
    </form>
</body>
</html>
/*测试版的实现 结束*/ 

bookseas
关注
专栏目录
【ASP.NET】第八课——GridView 控件的编辑功能优化，GridView控件中嵌套DropDownList控件
王迪
08-05 3453
知识点：掌握 GridView 的编辑、高亮显示的功能 、掌握 DetailsView 控件的数据展示、编辑和添加功能。 【ASP.NET】第七课——数据绑定和 GridView 控件的使用重点学习了 ASP.NET 中数据绑定的概念、数据绑定控件 GridView 的基本用法。使用它 能快速展示数据，并且能实现分页、删除操作。 GridView 的功能很强大，除了能分页、删除外，我们将继续学习它的编辑和高亮显示的 功能。GridView 的编辑如同 Exc...
GridView控件------隐藏和显示列
“开心最好”的专栏
05-12 1428
 一: 新建一个数据源.二:托动一个GridView到页面,设置数据源.三.托动一个DropList如图其中DropDownList1代码:  记住DropDownList1控件一定要设置AutoPostBack为true,不然就不能显示正常的结果,我当时也没有这么做,害我找了好久错在哪儿,笨啊! protected void Page_Load(object sender,
GridView控件数据行响应鼠标的单击和双击事件
编程资料大全
09-27 284
为了让GridView的数据行可以响应鼠标的单击和双击事件，一般我们会在GridView的RowDataBound事件中给&lt;tr&gt;加上客户端代码，为了简化这个步骤，我们来扩展一下它。控件开发1、新建一个继承自GridView的类。 /**////&lt;summary&gt;///继承自GridView///&lt;/summary&gt;[ToolboxData(@"&lt;{0}:...
asp.net webfrom jquery调用后台点击事件
suxuelian的博客
04-02 556
在日常做项目的时候，WebFrom项目，遇到一个前后端搭配加载数据的问题，就是前段点击按钮后，需要执行前段jquery ajax请求，也需要执行后台点击事件，于是就想到了一个处理办法，记录一下，以便大家使用。 前段aspx页面定义两个控件，一个为html标签，一个为服务器控件。 代码如下： <asp:Button ID="btn_Save" runat="server" Text="进行搜索" Style="display: none;" CssClass="btn btn-l btn-b
ASP.net使用技术总结（1）GridView控件的单击处理
weixin_30273501的博客
09-01 116
ASP.net 中Gridview控件没有单击处理，代替单击处理，以下两种方法可以处理。（1）用SelectedIndexChanged事件HTML Code <asp:CommandFieldButtonType="Button"HeaderText="添加"ShowHeader="True"SelectText="Add"ShowSelectButton="True">...
同时支持行单击和双击事件的 GridView/DataGrid
weixin_34037977的博客
05-17 173
功能： 单击行弹出当前行详细页面 双击行进入编辑状态（GridView/DataGrid内置 Edit） 说明： 单击事件（onclick）使用了 setTimeout 延迟，根据实际需要修改延迟时间 常见处理行方式会选择在 RowDataBound/ItemDataBound 中处理，这里我选择 Page.Render 中处理，至少基于以下考虑 RowDataBound 仅仅...
DEV gridview 捕获行双击事件
kone666
06-26 549
private void ViewHtlb_MouseDown(object sender, MouseEventArgs e)          {              if (e.Button == MouseButtons.Left && e.Clicks == 2) // 判断是否是用鼠标双击                {                  DevExpr
ASP.NET GridView 和GridData行单击与双击事件
05-26
在ASP.NET开发中，GridView控件是用于展示数据表格的常用组件，而GridData则可能是自定义或扩展的类似控件。本主题将深入探讨如何处理GridView和GridData控件的行单击与双击事件，以实现弹出详细页面和编辑状态更新...
商业源码-编程源码-GridView自定义控件源码.zip
06-15
2. **行为定制**：你可以添加新的事件处理程序，以响应用户交互，如单击、双击、排序、分页等。这些事件可以扩展GridView的功能，比如在用户点击某一列时触发自定义操作。 3. **数据绑定**：默认的GridView控件支持...
gridview控件的使用（九宫式的的排列）
06-10
6、数据行响应鼠标的单击和双击事件 RowClickButtonID - 行单击事件所对应的按钮的ID RowDoubleClickButtonID - 行双击事件所对应的按钮的ID 7、改变通过CheckBox选中的行的样式 CheckBoxID - 模板列的项复选框...
插入控件工具箱中的命令按钮，双击，输入以下代码：
09-25
1、输入题干： “人们有时要利用惯性，有时要防止惯性带来的危害，下列事件中利用惯性的有：” 2、在控件工具箱中点击“复选框”，在PPT中拉四个“复选框”，并分别在其“caption”属性中输入各选项答案。这四个复选框系统会默让名称为“CheckBox1”-“CheckBox4”。 3、插入控件工具箱中的命令按钮，双击，输入以下代码： If CheckBox1.Ｖalue = False And CheckBox2.Ｖalue = True And CheckBox3.Ｖalue = False And CheckBox4.Ｖalue = True Then MsgBox "恭喜你，答对了" Else MsgBox "不对，请再思考一下" End If 注意：由于博客系统对特殊词的屏蔽，以上代码中的“Ｖalue”的第一个字母请重新修改为半角状态下的“V”。 4、完成。我这里是选项2和选项4为正确答案，你可以根据自己的题及答案进行修改，这个很简单的，正确答案的属性值为“true”，错误的设为“false”。
Gridview实现行单击和双击事件
weixin_30446613的博客
05-05 279
protected override void Render(HtmlTextWriter writer) { foreach (GridViewRow row in GridView1.Rows) { row.Attributes.Add("BorderColor ", "#d2d2d2"); ...
[C#/DevExpress]DevExpress的GridControl添加按钮的点击效果问题
云丶峰的博客
06-01 1048
问题：在GridControl中添加一列按钮，点击时第一次聚焦到单元格，第二次才触发点击事件，体验不好； 处理：设置GridView的OptionsBehavior-EditorShowMode，设置为MouseDown即可！
记录winform+devpress 表格行内操作默认双击才会触发事件，修改属性EditorShowMode 可单击
最新发布
卢小亦的博客
04-13 218
winfrom+devpress grid行内操作
DevExpress中的gridcontrol方法和使用(Winfrom)2事件
m0_61746796的博客
11-22 872
DevExpress中的gridcontrol方法和使用(Winfrom)2事件
ASP.NET前端gridview中实现点击事件（ImageButton、ButtonField两种方式）
katarina_OK的博客
12-22 1288
<asp:GridView ID="gvData" runat="server" SkinID="PTIGV_Blue3" Width="100%" OnRowDataBound="gvData_RowDataBound" OnRowCommand="gvData_RowCommand" AutoGenerateColumns="False" OnRowCreated="gvData_RowCreated"> <Columns>
GridView 动态绑定控件 OnRowCommand事件触发
weixin_30908103的博客
06-30 340
主题：GridView动态生成的控件不能触发OnRowCommand事件，且点击控件按钮后，控件的值会消失。 案例， 由于公司需要绑定的数据列顺序是动态生成的，且有的数据列需要绑定Button控件。所以需要动态绑定TemplateField。 问题，不能触发OnRowCommand事件和点击控件按钮后，控件的列值会消失。 不能触发OnRowCommand代码如下： using S...
OnPreRender与Render的区别
watcher_n的专栏
07-01 2243
protected override void OnPreRender(EventArgs e) protected override void Render(HtmlTextWriter writer) 这两个的区别。可否告知====================================================asp.net页面在触发各个子控件的事件之后
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值