JavaScript实现GriwView单列全选(自写代码)


Posted in Javascript onMay 13, 2013

在 GridView 里有一系列的 Checkbox ,要实现对其全选或全不选。开始在网上找了,但是参考的代码会全选 GridView 里所有的 Checkbox ,而我要的是单列全选。如图:
JavaScript实现GriwView单列全选(自写代码) 
审核和权限是要分开的。
JavaScript实现GriwView单列全选(自写代码) 
JavaScript实现GriwView单列全选(自写代码)
我自己写了 JavaScript 代码,贴出来供大家参考。

function chkAll(CheckAll) { 
var items = document.getElementsByTagName("input"); 
for (var i = 0; i < items.length; i++) { 
if (items[i].type == "checkbox"){ 
for (var j = 2; j < 10; j++) { 
var id = "ctl00_ContentPlaceHolder1_GridView1_ctl0" + j + "_CheckBox1"; 
if (items[i].id == id) { 
items[i].checked = CheckAll.checked; 
} 
} 
} 
} 
}

其中,第5行的 j 和 第6行的 id 是用来确定同一列的 Checkbox,具体 j 的范围以及 id 可能不同,可以通过 alert(items[i].id); 遍历整个 items 查看相应的 id 。
前台的相应代码如下:
<asp:TemplateField HeaderText="审核"> 
<HeaderTemplate> 
<asp:CheckBox ID="chkAll" onclick='chkAll(this)' runat="server" /> 
审核 
</HeaderTemplate> 
<ItemTemplate> 
<asp:CheckBox ID="CheckBox1" Checked='<%# Eval("isCheck") %>' runat="server" /> 
</ItemTemplate> 
<ItemStyle HorizontalAlign="Center" Width="100px" /> 
</asp:TemplateField>
Javascript 相关文章推荐
JQuery 学习笔记 选择器之六
Jul 23 Javascript
拖动布局之保存布局页面cookies篇
Oct 29 Javascript
js形成页面的一种遮罩效果实例代码
Jan 04 Javascript
javascript:FF/Chrome与IE动态加载元素的区别说明
Jan 26 Javascript
jquery图片轮播插件仿支付宝2013版全屏图片幻灯片
Apr 03 Javascript
在JavaScript中使用timer示例
May 08 Javascript
JS读写CSS样式的方法汇总
Aug 16 Javascript
vue下拉菜单组件(含搜索)的实现代码
Nov 25 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
May 24 Javascript
js防抖函数和节流函数使用场景和实现区别示例分析
Apr 11 Javascript
JS前端基于canvas给图片添加水印
Nov 11 Javascript
带你使用webpack快速构建web项目的方法
Nov 12 Javascript
jquery实现漂浮在网页右侧的qq在线客服插件示例
May 13 #Javascript
js 程序执行与顺序实现详解
May 13 #Javascript
JS/jQuery实现默认显示部分文字点击按钮显示全部内容
May 13 #Javascript
JS 加入收藏夹的代码(主流浏览器通用)
May 13 #Javascript
jQuery实现长文字部分显示代码
May 13 #Javascript
jq选项卡鼠标延迟的插件实例
May 13 #Javascript
jQuery获取CSS样式中的颜色值的问题,不同浏览器格式不同的解决办法
May 13 #Javascript
You might like
解析dedeCMS验证码的实现代码
2013/06/07 PHP
基于preg_match_all采集后数据处理的一点心得笔记(编码转换和正则匹配)
2014/01/31 PHP
jQuery动态创建html元素的常用方法汇总
2014/09/05 Javascript
JavaScript操作 url 中 search 部分方法函数
2016/06/15 Javascript
javascript深拷贝(deepClone)详解
2016/08/24 Javascript
JS html时钟制作代码分享
2017/03/03 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
2017/05/05 Javascript
ES6深入理解之“let”能替代”var“吗?
2017/06/28 Javascript
ES6新增数据结构WeakSet的用法详解
2017/08/07 Javascript
JavaScript实现旋转轮播图
2020/08/18 Javascript
高性能的javascript之加载顺序与执行原理篇
2018/01/14 Javascript
js使用Promise实现简单的Ajax缓存
2018/11/14 Javascript
JQuery获取可视区尺寸和文档尺寸及制作悬浮菜单示例
2019/05/14 jQuery
Vue防止白屏添加首屏动画的实例
2019/10/31 Javascript
js实现简单的打印表格
2020/01/15 Javascript
node.JS二进制操作模块buffer对象使用方法详解
2020/02/06 Javascript
vue实现列表滚动的过渡动画
2020/06/29 Javascript
详解在IDEA中将Echarts引入web两种方式(使用js文件和maven的依赖导入)
2020/07/11 Javascript
JavaScript编码小技巧分享
2020/09/17 Javascript
python按行读取文件,去掉每行的换行符\n的实例
2018/04/19 Python
Python tkinter的grid布局及Text动态显示方法
2018/10/11 Python
python微信公众号之关注公众号自动回复
2018/10/25 Python
使用虚拟环境打包python为exe 文件的方法
2019/08/29 Python
Django单元测试中Fixtures用法详解
2020/02/25 Python
Django配置跨域并开发测试接口
2020/11/04 Python
Python爬虫之Selenium库的使用方法
2021/01/03 Python
土木工程师岗位职责
2013/11/24 职场文书
制药工程专业毕业生推荐信
2013/12/24 职场文书
四年级语文教学反思
2014/02/05 职场文书
社区班子对照检查材料
2014/08/27 职场文书
公司的门卫岗位职责
2014/09/09 职场文书
2014年劳动部工作总结
2014/12/11 职场文书
教师节班会开场白
2015/06/01 职场文书
解析Java异步之call future
2021/06/14 Java/Android
springboot如何初始化执行sql语句
2021/06/22 Java/Android
浅谈MySql update会锁定哪些范围的数据
2022/06/25 MySQL