我想实现这样一个效果:单击gridview的行内任意地方都可以选择该行(就是行内复选框被选中),同时修改该行的背景色。当再次单击行内任意地方又可以取消选择。
另外,当单击选择行内复选框时,我希望可以选择复选框,同时修改行的背景色;单击取消行内复选框时,还原行的背景色,取消复选框的选中状态。
前台大概是这样的

为了实现单击选择或取消选择行,我是在gridview的RowDataBound事件中这么写的:

for (i = ; i <= GridView1.Rows.Count; i++)
{
//首先判断是否是数据行
if (e.Row.RowType == DataControlRowType.DataRow)
{
//当鼠标点击时更改背景色
e.Row.Attributes.Add("onclick", "ck=this.getElementsByTagName('input');if(ck[0].type=='checkbox'&&ck[0].checked==false) {this.style.backgroundColor='#00A9FF';ck[0].checked=true;alert('单击行选择该行');}else {this.style.backgroundColor='#ffffff';ck[0].checked=false;alert('单击行不选中该行');}");
}
}

上面的alert是测试用的,请自行忽略。
为了实现通过行内的复选框选择和取消选择一行,我在行复选框的onclick里面的js代码如下所示:

function SelectedSingle(cb) {
var row = cb.parentNode.parentNode;
if (cb.checked) {
row.style.backgroundColor = "#66ff33";
}
else {
row.style.backgroundColor = "";
}
}

这个地方的alert和颜色是测试用的,视觉效果请暂时不管。

然后问题来了:我单击选择或取消选择行复选框时,似乎选不了行了。经测试发现是单击复选框时先执行了checkbox的onclick事件,然后执行了行的onclick事件。
于是结果是:在checkbox的onclick里面已经实现了需要的效果,然后再行的onclick事件中把实现的效果给抹杀还原了。
于是,我把行的onclick事件取消掉,改为onmousedown事件。结果发现,这个时候需要的效果是出来了,但是似乎复选框的onclick事件根本没执行。请问,这是何原因呢?

gridview的行选择的一个问题的更多相关文章

  1. JS控制GridView行选择

    ASP.NET里的GridView控件使用非常广泛,虽然其功能强大,但总有一些不尽如人意的地方.比如在选择行的时候,它就没有UltraWebGrid做的友好:UltraWebGrid允许用户设置是否显 ...

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

    功能: 单击选中行,双击打开详细页面 说明:单击事件(onclick)使用了 setTimeout 延迟,根据实际需要修改延迟时间 ;当双击时,通过全局变量 dbl_click 来取消单击事件的响应  ...

  3. [每日电路图] 7、设计一个PCB的流程及细节·总结——给外行的同学或刚入行的同学一个宏观鸟瞰电路板设计的大致流程的文章

    前言 最近两天使用AD14软件设计了一个蓝牙防丢器电路板(PCB)图纸,中间有一些细节在本文中记录下,方便下次设计PCB时参考.也希望能给外行的同学或刚入行的同学一个宏观鸟瞰电路板设计的大致流程的文章 ...

  4. Pandas之容易让人混淆的行选择和列选择

    在刚学Pandas时,行选择和列选择非常容易混淆,在这里进行一下讨论和归纳 本文的数据来源:https://github.com/fivethirtyeight/data/tree/master/fa ...

  5. 动态横向(水平)合并GridView数据行DataRow的列

    前一段时间,Insus.NET有写过<动态合并GridView数据行DataRow的列>http://www.cnblogs.com/insus/p/3238348.html, 那是纵向( ...

  6. 【SecureCRT配置】修改默认卷屏行数当做一个操作,屏幕输出有上百行,当需要将屏幕回翻时,这个设置会有很大帮助,默认为500行,可以改为10000行,不用担心找不到了。 选项 => 全局选项 => Default Session => Edit Default Settings => Terminal => Emulation => Scrollback 修改为32000。

    SecureCRT配置屏幕内容输出到log文件 SecureCRT看不到前几分钟操作的内容,或者想把通过vi命令查看的日志输出到log文件(在懒得下载日志文件的情况下),所以接下来就这样操作: 文件保 ...

  7. DEV express 对Gridview某行的元素赋值

    1:获取选中的行某列的值 string colValue= this.gridView1.GetRowCellValue(this.gridView1.FocusedRowHandle, this.g ...

  8. GRIDVIEW多行多列合并单元格(合并列)

    GitHub项目地址:https://github.com/mingceng/merge-gridviewcell 去年的时候,我写了两篇文章:  GridView多行多列合并单元格(完整代码和例子) ...

  9. 通过 Mesos、Docker 和 Go,使用 300 行代码创建一个分布式系统

    [摘要]虽然 Docker 和 Mesos 已成为不折不扣的 Buzzwords ,但是对于大部分人来说它们仍然是陌生的,下面我们就一起领略 Mesos .Docker 和 Go 配合带来的强大破坏力 ...

随机推荐

  1. 调用天气预报webservice

    <script src="jquery.js" type="text/javascript" charset="utf-8">& ...

  2. Clojure学习笔记(一)——介绍、安装和语法

    什么是Clojure Clojure是一种动态的.强类型的.寄居在JVM上的语言. Clojure的特性: 函数式编程基础,包括一套性能可以和典型可变数据结构媲美的持久性数据结构 由JVM提供的成熟的 ...

  3. Mongodb异常关闭重启失败解决

    情况再现,连接mongodb的网站没有关,直接关闭了mongodb的cmd窗口.再次打开mongodb出现失败. 解决办法:网上说是删除 *.lock文件,再进行 --repair ,最后再打开mon ...

  4. hibernate FetchType理解

    JPA定义实体之间的关系有如下几种: @OneToOne @ManyToOne @OneToMany @ManyToMany 在定义它们的时候可以通过fetch属性指定加载方式,有两个值: Fetch ...

  5. 【USB多路电源】---需求分析方案制定

    需求描述: USB接口输入5V,分别输出±5V,100mA; 3.3V,100mA: 1.2V,500mA:四路电源.同时可给锂电池充电,在移除USB输入时锂电池能供电. 分析: 首先考虑需要一个充电 ...

  6. 另一种图片上传 jquery.fileupload.js

    今天遇到另外一种上传图片方法 用jquery.fileupload.js <input type="file" name="file[]" multipl ...

  7. 当一个activity中按钮过多时怎么办?

    这几天看极客学院的视频,跟视频中的老师学到的一些小技巧~~ .setOnClickListener(this) 通过重写this(我猜的是重写),下面有onClicked() package exam ...

  8. mysql、pymysql、SQLAlchemy

    1.MySQL介绍 http://www.cnblogs.com/wupeiqi/articles/5699254.html,基础操作参见此文章,此处不赘述. 安装:yum install mysql ...

  9. BFC and Haslayout

    一.BFC(Block Formatting Context) 相关网址:http://www.cnblogs.com/dolphinX/p/3508869.html 1. 怎样才能形成BFC flo ...

  10. UVA 208 (DFS)

    题意:找出1到T的所有路径: 坑点:一开始以为是到终点,读错了题意,没测试第二个样例,结果WA了4遍,坑大了: #include <iostream> #include <cmath ...