asp.net实现分组全选部分复选框

asp.net|分组|复选框

1.声明控件,分别在页面上方一个CheckBox叫cb5,一个CheckBoxList叫shi2:
protected System.Web.UI.WebControls.CheckBox cb5;
protected System.Web.UI.WebControls.CheckBoxList shi2;

2.在aspx的html代码的head里键入以下函数
<script>
function chkchk(chkid,spanid){
var o=document.getElementById(chkid);
var obj = document.getElementById(spanid);
obj=obj.children;
for(i=0;i<obj.length;i++)
{
e=obj[i];
if(e.type=="checkbox"){
obj[i].checked=o.checked;
}
}
}
</script>
3.在后台编码里添加自定义属性
private void Page_Load(object sender, System.EventArgs e)
{
cb5.Attributes.Add("onclick","chkchk('"+cb5.ClientID+"','"+shi2.ClientID+"');");
}
4.我们来观察一些自动生成的html代码,我们就明白了
<input id="to1_cb5" type="checkbox" name="to1:cb5" onclick="chkchk('to1_cb5','to1_shi2');" />
<label for="to1_cb5">市律师协会</label>
<span id="to1_shi2">
<input id="to1_shi2_0" type="checkbox" name="to1:shi2:0" />
<label for="to1_shi2_0">admin</label>
<br>
<input id="to1_shi2_1" type="checkbox" name="to1:shi2:1" />
<label for="to1_shi2_1">5</label>
</span>
5.注意我是把所有的控件放在一个to1的UserControl里面的,所以生成的控件ID前面都带有一个"to1_",又是一下午时间,就整出来一个这个,总感觉asp.net对一些客户端编程结合的不是很好,如果不写脚本,做联动选择的话只能用服务器事件了,这就要每点击一下复选框回传一下窗体,这从性能上考虑是非常不值得的,只能出此下策了.本文的主要知识点是JavaScript的文档对象和和控件的嵌套模型,以及给服务器控件加一些客户端行为属性.
最后感谢donet技术交流群的Henman 姐姐的技术支持

时间: 2024-08-17 18:36:16

asp.net实现分组全选部分复选框的相关文章

使用ASP与JAVASCRIPT配合实现多个复选框数据关联显示

作者:平凡点滴[一凡]<HTML><HEAD><META NAME="AUTHOUR" Content="DANNY KANG"><META NAME="CreateDate" Content="2004-10-28"><META NAME="Keywords" Content="DANNY KANG,DannyKang,DK,[D.K],pi

使用ASP与&amp;#106avascript配合实现多个复选框数据关联显示

复选框|数据|显示 今天在CSDN上看到一提问:http://community.csdn.net/Expert/topic/3496/3496350.xml?temp=.4479639 .应楼主要求,特写一段实现代码如下. <!-----------------------------------------------------------------------------------------------><HTML><HEAD><META NAME=

Asp.net MVC视频教程 18 单选与复选框

[hjp2=480,320,true]http://player.youku.com/player.php/Type/Folder/Fid/2416830/Ob/1/Pt/17/sid/XNDU4MzMwODA=/v.swf[/hjp2]     http://v.youku.com/v_playlist/f2416830o1p17.html

jquery复选框全选/取消示例

 jquery复选框全选/取消示例,实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态  功能:   a:实现点击复选框的时候全选所有的子复选框,再点击取消所有复选框的选中状态   b:有一个子复选框选中则父复选框选中 所有子复选框都不选中则父复选框不选中 代码如下: /**  * 全选函数  * @param mainId 主复选框id  * @param klass 下属复选框的class  */ function selectAll(mainId,klass){  $(

jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证_jquery

jQuery实现按钮的点击 全选/反选 单选框/复选框 文本框 表单验证 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <base href="<%=basePath%>"> <title>My JSP 'index.jsp' starting page</title> &l

JS实现CheckBox复选框全选、不选或全不选功能_javascript技巧

CheckBox控件表明一个特定的状态(即选项)是选定 (on,值为1) 还是清除 (off,值为0).在应用程序中使用该控件为用户提供"True/False"或"yes/no"的选择.因为 CheckBox 彼此独立工作,所以用户可以同时选择任意多个 CheckBox,进行选项组合. CheckBox复选框JS实现全选.不选.全不选功能,很简单,具体内容如下 思路: 1.获取元素 2.给全选 不选 反选添加点击事件 3.用for循环checkbox 4.把chec

基于jquery实现复选框全选,反选,全不选等功能_jquery

jquery 实现全选,反选,全不选等功能,下面直接以例子进行说明.设页面有如下一组复选框和几个相关按钮(全选,反选,全不选等): <input type="checkbox" name="fruit" value="apple" />苹果 <input type="checkbox" name="fruit" value="orange" />橘子 <in

利用Bootstrap实现表格复选框checkbox全选_javascript技巧

首先来看看实现的效果图: HTML中无需添加额外的一列来表示复选框,而是由JS完成,所以正常的表格布局就行了: <table class="table table-bordered table-hover"> <thead> <tr class="success"> <th>类别编号</th> <th>类别名称</th> <th>类别组</th> <th

js与jQuery实现checkbox复选框全选/全不选的方法_javascript技巧

本文实例讲述了js与jQuery实现checkbox复选框全选/全不选的方法.分享给大家供大家参考,具体如下: 先来看看JavaScript实现checkbox复选框全选/全不选的方法.这应该是一个比较实用的前端技巧吧,很多时候我们都需要点击一个checkbox,然后将所有的复选框自动全部选中,比如新浪邮箱中,一些CMS系统的后台中,使用本JS效果后,会大大增强了操作体验,那么究竟是如何实现这一功能的呢?别着急,跟我一步一步实现. 我们先把那些带复选框的列表弄好,还没加全选.全不选时候的状态,大