jquey复选框三级分类关联一二级分类
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Category_Manage_New_Two.aspx.cs"
Inherits="Lilaidao.Admin.Weblogin.Category_Manage_New_Two" %> <%@ Register Src="bottom.ascx" TagName="bottom" TagPrefix="V5" %>
主要代码如下
<!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 id="Head1" runat="server">
<title>商品分类管理</title>
<link href="css/css.css" rel="stylesheet" type="text/css" />
<link href="css/css_list.css" rel="stylesheet" type="text/css" />
<link href="css/control.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript" src="js/Common.js"></script>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("input[name='Category1']").click(function () {
var idvalue = $(this).val();
var check = this.checked;
var idvalue2;
var check2;
$("input[name='Category2']").each(function (index, ele) {
if ($(ele).attr("ParentId") == idvalue) {
ele.checked = check;
idvalue2 = $(ele).val();
check2 = ele.checked;
$("input[name='Category3']").each(function (index, ele) {
if ($(ele).attr("ParentId") == idvalue2) {
ele.checked = check2;
}
});
}
}); }) $("input[name='Category2']").click(function () {
var parentId = $(this).attr("ParentId") //得到二级分类的父Id
var check = this.checked; //二级分类的选中状态
$("input[name='Category1']").each(function (index, ele) {
if ($(ele).val() == parentId) {
var idvalue = $(this).val() //得到一级分类的id
//var countOne = $("input[type='checkbox'][parentid='" + idvalue + "']").length //得到二级分类选择框总数
//得到二级分类选择的个数如果大于0 一级分类选中
var count = $("input[type='checkbox'][parentid='" + idvalue + "']:checked").length;
count > ? ele.checked = true : ele.checked = false;
} }) idvalue2 = $(this).val(); //得到三级分类的父id
check2 = this.checked; //二级分类的选中状态
$("input[name='Category3']").each(function (index, ele) {
if ($(ele).attr("ParentId") == idvalue2) {
ele.checked = check2;
}
}); }); $("input[name='Category3']").click(function () {
var parentId = $(this).attr("ParentId") //得到三级分类的父Id
var check = this.checked; //三级分类的选中状态
$("input[name='Category2']").each(function (index, ele) {
if ($(ele).val() == parentId) {
var idvalue = $(this).val() //得到二级分类的id
//var countOne = $("input[type='checkbox'][parentid='" + idvalue + "']").length //得到二级分类选择框总数
//得到三级分类选择的个数如果大于0 二级分类选中 ,对应的一级分类也选中
var count = $("input[type='checkbox'][parentid='" + idvalue + "']:checked").length;
// count > 0 ? ele.checked = true : ele.checked = false;
if (count > ) {
ele.checked = true //选中二级分类
var id1 = $(ele).attr("ParentId") //得到一级分类的id
$("input[type='checkbox'][value='" + id1 + "']").attr("checked", "checked"); //选中一级分类 } else {
ele.checked = false; //选中二级分类
var id1 = $(ele).attr("ParentId") //得到一级分类的id
$("input[type='checkbox'][value='" + id1 + "']").attr("checked", ""); //不选中一级分类
}
} }) }); })
</script>
</head>
<body>
<form id="form1" method="post">
<div class="OperateTitle">
<div>
【 商品分类管理 】
</div>
</div>
<% foreach (var item1 in list1)
{
string checks1 = "";
if (item1.IsMarket==true)
{
checks1 = "checked='checked'";
}
%>
<input type="checkbox" name="Category1"<%=checks1%> id=<%=item1.Id%> value= <%=item1.Id%> parentid="<%=item1.ParentId%>" / >
<label for=<%=item1.Id%>><%=item1.Title %></label> <% var listCate2 = cgbll.GetList(item1.Id, false);
if (listCate2.Count > )
{ %>
<br />  
<% }%>
<% foreach (var item2 in listCate2)
{
string checks2 = "";
if (item1.IsMarket == true)
{
checks2 = "checked='checked'";
}
%>
<input type="checkbox" name="Category2" <%=checks2%> id=<%=item2.Id%> value= <%=item2.Id%> parentid="<%=item2.ParentId%>" / > <label for=<%=item2.Id%>><%=item2.Title %></label>
<% var listCate3 = cgbll.GetList(item2.Id, false);
if (listCate3.Count>)
{%>
<br />    
<% foreach (var item3 in listCate3 )
{
string checks3 = "";
if (item1.IsMarket == true)
{
checks3 = "checked='checked'";
}
%>
<input type="checkbox" name="Category3"<%=checks3%> id=<%=item3.Id%> value= <%=item3.Id%> parentid="<%=item3.ParentId%>" / > <label for=<%=item3.Id%>><%=item3.Title %></label>
<% } %>
<br />  
<br />  
<% } %>
<% }%>
<br />
<br />
<% } %>
<input type="submit" value="保存" class="button" style="margin-left:50px"/>
</form>
<V5:bottom ID="bottom" runat="server" />
</body>
</html>
jquey复选框三级分类关联一二级分类的更多相关文章
- Qt树形控件QTreeView使用1——节点的添加删除操作 复选框的设置
QtreeView是ui中最常用的控件,Qt中QTreeWidget比QTreeView更简单,但没有QTreeView那么灵活(QTreeWidget封装的和MFC的CTreeCtrl很类似,没有m ...
- DevExpress XtraGrid RepositoryItemCheckEdit 复选框多选的解决方法
1. RepositoryItemCheckEdit默认有三种状态,选中状态.未选中状态和半选中状态(半选中状态通常用在TreeList中如果父节点下的子节点有选中的有未选中的,则父节点状态为半选中状 ...
- 原生js实现三级复选框
工作中要做一个三级的复选框,用js实现了一下,从项目中把相关代码抽取出来了,有相关需求的可以参考一下.亲测可用. <!DOCTYPE html> <html> <head ...
- vue基于element-ui的三级CheckBox复选框
最近vue项目需要用到三级CheckBox复选框,需要实现全选反选不确定三种状态.但是element-ui table只支持多选行,并不能支持三级及以上的多选,所以写了这篇技术博文供以后学习使用. 效 ...
- MVC树控件,mvc中应用treeview，实现复选框树的多层级表单控件
类似于多层级的角色与权限控制功能,用MVC实现MVC树控件,mvc中应用treeview,实现复选框树的多层级表单控件.最近我们的项目中需要用到树型菜单,以前使用WebForm时,树型菜单有微软提供的 ...
- jquery复选框 选中事件 及其判断是否被选中
jquery复选框 选中事件 及其判断是否被选中 (2014-07-25 14:03:54) 转载▼ 标签: jquery复选框选中事件 分类: extjs jquery 今天做了 显示和不显示密 ...
- jquery 使用attr() 函数对复选框无效的原因,javascript那些事儿——properties和attributes
复选框是网站开发的时候经常用到的网页标签之一,常见的在页面上对复选框的操作包括取值和修改复选框的状态.在jquery中,常见的操作标签的值得函数为attr,然而在操作复选框的时候,通常采用的却是pro ...
- Qt之QHeaderView添加复选框
简述 前面分享了QTableView中如何添加复选框.本节主要介绍QTableView中的表头-QHeaderView添加复选框的功能,下面以水平表头为例,垂直表头类似! 简述 效果 QHeaderV ...
- ListBox复选框拓展
Toolkit的LongListMutiSelector的复选框功能,想必许多人都需要吧!然而系统本身控件ListBox虽然也有多选功能,可是外观上却缺乏复选框,选择效果只是颜色变化.于是在上一个项目 ...
随机推荐
- 平衡树（Splay）：Splaytree POJ 3580 SuperMemo
SuperMemo Description Your friend, Jackson is invited to a TV show called SuperMemo in which ...
- Android USB安全调试
Android 4.2.2 引入了USB安全调试方面的内容,当启用安全调试的时候,只有被用户认证过的主机才可以通过Android SDK自带的ADB工具经由USB连接来访问设备的内部构件. 下面以an ...
- c++转换构造函数和类型转换函数
看stl源码时,有一段代码感觉很奇怪 iterator begin() { return (link_type)((*node).next); } iterator和link_type是两种不同类型, ...
- Codeforces Round #260 (Div. 1) --B. A Lot of Games （Trie）
B. A Lot of Games Andrew, Fedor and Alex are inventive guys. Now they invent the game with strings f ...
- Directx 3D编程实例：随机绘制的立体图案旋转
最近朋友建议我写一些关于微软云技术的博客留给学校下一届的学生们看,怕下一届的MSTC断档.于是我也觉的有这个必要. 写了几篇博客之后,我觉得也有必要把这一年的学习内容放在博客做个纪念,就这样写了本篇博 ...
- webstrom开发微信小程序说明
在操作之前,需要对webstrom做一些设置,如下 如果未安装node.js的朋友,请到如下地址 https://nodejs.org/en/ 安装(相信大家都是会的),如果安装完了之后,就使用如下的 ...
- lucene4.5近实时搜索
近实时搜索就是他能打开一个IndexWriter快速搜索索引变更的内容,而不必关闭writer,或者向writer提交,这个功能是在2.9版本以后引入的,在以前没有这个功能时,必须调用writer的c ...
- Android Dialog触摸对话框外部让其消失的实现方法
方法一: @Override public boolean onTouchEvent(MotionEvent event) { if (event.getAction() == MotionEvent ...
- linux两台server远程copy文件
1.将远程机器的文件copy到本地 scp -r root@10.10.15.25:/bea /gg 将远程的/bea copy到/gg以下 -r Recursively copy ent ...
- [Angular 2] Controlling how Styles are Shared with View Encapsulation
Style and View Encapsulation is best understood by seeing how each option (Emulated, Native, and Non ...