<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<%response.setHeader("Pragma","No-cache");
response.setHeader("Cache-Control","no-cache");
response.setDateHeader("Expires", 0);
response.flushBuffer();%>
<%@ include file="/util/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk">
<script type="text/javascript">
//级联勾选函数
function getchecks() {
var parentCategorys = document.getElementsByName("parentchk");
for (var k=0; k<parentCategorys.length; k++){
var test = parentCategorys[k];
if (test.checked) {
var id = test.id;
var childs = document.getElementsByName("chk");
var a = 0;
for (var i=0; i<childs.length; i++){
var child = childs[i];
var parentid = child.id;
//alert(id==parentid);
if (id==parentid) {
child.checked = true;
}
}
}else{
continue;
}
}
}
</script>
<title>人群关联度</title>
</head>
<body>
<div class="page">
<div class="pageHeader">
</div>
<div class="pageContent">
<form method="post" id="addre" action="${pageContext.request.contextPath }/exactrelated.do?action=categoryRes&flag=save" class="pageForm required-validate" onsubmit="return validateCallback(this);">
<input type="hidden" name="categoryId" value="${categoryId }"/>
<div class="pageFormContent" layoutH="56" width="60">
<!-- 父类循环,父类被勾选的时候下面的子类都相应的被勾选上 -->
<c:forEach items="${parentCategoryList}" var="m">
<c:if test="${m.pid == 0}">
<p>
<c:choose>
<c:when test="${m.flag==0}">
<label><input type="checkbox" id="${m.categoryId }" name="parentchk" value="${m.categoryId }" checked onclick="getchecks()"/> <font style="color:red">${m.categoryName }</font></label>
</c:when>
<c:otherwise>
<label><input type="checkbox" id="${m.categoryId }" name="parentchk" value="${m.categoryId }" onclick="getchecks()" /> <font style="color:red">${m.categoryName }</font></label>
</c:otherwise>
</c:choose>
</p>
</c:if>
<!-- 子类循环 -->
<c:forEach items="${categoryList}" var="l">
<c:if test="${m.categoryId == l.pid}">
<p>
<c:choose>
<c:when test="${l.flag==0}">
<label><input type="checkbox" flag="${m.categoryId }" id="${l.pid}" name="chk" value="${l.categoryId }" checked/> ${l.categoryName }</label>
</c:when>
<c:otherwise>
<label><input type="checkbox" flag="${m.categoryId }" id="${l.pid }" name="chk" value="${l.categoryId }" /> ${l.categoryName }</label>
</c:otherwise>
</c:choose>
</p>
</c:if>
</c:forEach>
<div class="divider"></div>
</c:forEach>
</div>
<div class="formBar">
<ul>
<li><div class="buttonActive"><div class="buttonContent"><button type="submit">保存</button></div></div></li>
<li>
<div class="button"><div class="buttonContent"><button type="Button" onclick="navTab.closeCurrentTab()">取消</button></div></div>
</li>
</ul>
</div>
</form>
</div>
</div>
</body>
</html>
分享到:
相关推荐
更重要的是,级联勾选(Cascading Checkbox Selection)功能使得当一个父节点被选中或取消选中时,其所有子节点都会自动跟随改变状态。这对于处理大量关联数据时非常有用,用户只需要操作一次父节点就能影响到所有子...
使用javascript实现checkbox级联选择
flex tree+checkbox可实现级联勾选 修改后 修改CheckTreeDemoRenderer.as这个文件中 while (!cursor.afterLast){ if (cursor.current.@state == STATE_CHECKED) { noChecks++; }else if (cursor.current.@state =...
如果父级复选框被取消选中,所有子级复选框也应取消选中。这可以通过JavaScript实现,监听`change`事件并根据当前复选框的`checked`状态和层级关系更新相关节点。 在JavaScript中,我们可以这样处理: ```...
本教程将详细讲解如何利用HTML5和CSS3来创建一个具有独特选中样式的checkbox多选框特效。 首先,HTML5的`<input>`标签用于创建交互元素,其中`type="checkbox"`属性定义了一个复选框。基本的HTML结构可能如下: ``...
在网页设计和开发中,复选框(Checkbox)是一种常见的用户界面元素,允许用户从多个选项中选择一个或多个。当涉及到数据提交,比如通过HTML表单POST方法将用户的选择发送到服务器并存储到数据库中时,理解如何处理复...
这种菜单通过一个或多个层级的勾选框(checkbox)来实现子项与父项之间的勾选联动,使得用户在进行选项选择时,能够更加直观和高效地操作。 ### 核心概念解析 #### 1. 级联勾选机制 级联勾选菜单的核心在于其勾选...
"checkbox 用shift键 级联选择"这个话题涉及到一种提高用户效率的交互设计,它允许用户通过按下Shift键快速选择一系列连续的复选框(checkboxes)。在网页或应用程序中,复选框通常用于让用户在多个选项中进行多选。...
如果所有子项都被选中,父级复选框应显示为全选状态。 在实际应用中,"testCheckedTree"可能是一个包含示例代码的文件,例如,它可能包含了一个已实现上述功能的QTreeWidget实例。这个文件可能包括了创建自定义...
每个复选框都有一个`value`属性,用来表示其值,以及一个`checked`属性,用于指示当前是否被选中。 全选功能通常需要一个主控复选框,当用户点击这个主控复选框时,所有相关的子复选框都被选中。这可以通过获取所有...
本篇文章将详细讲解如何在ListView中实现CheckBox复选框的功能。 首先,我们需要创建一个自定义的ListView适配器。适配器是连接数据源和ListView的关键,它负责将数据转化为可显示的视图。创建一个继承自`...
方便大家复制粘贴使用,提高大家的效率。...全端都支持 引入组件即可 <TC-checkbox></TC-checkbox> 如需要删除多余的部分 uni_modules/TC-checkbox/components/TC-checkbox/TC-checkbox 以上路径上进行修改即可
本篇文章将聚焦于“两个JSP页面之间传值的问题”以及与之相关的“checkbox多选框”处理。博主houyajie在iteye博客上分享了这个问题的解决方案,让我们深入探讨一下。 首先,我们来看JSP页面间传值的基本方法: 1. ...
在这个场景中,我们关注的是它如何实现记录checkbox(复选框)的勾选顺序,并在页面上展示,同时能够将这些值传递给后台。下面将详细解释这一技术实现。 首先,复选框在网页表单中被广泛使用,让用户可以选择多个...
在前端开发中,CheckBox Tree(复选框树)是一种常见的组件,用于展示具有层级关系的数据,并支持用户进行多级选择。这个"纯JS+HTML写的checkBox Tree 级联选中"实例,解决了其他示例中可能存在的BUG,提供了一个...
本文将详细讲解如何实现一个带有复选框(Checkbox)的树形列表(TREE LIST)的级联选择功能,以及相关的Java标签形式实现。这种功能常见于权限管理、组织结构选择等场景,让用户能够方便地进行多层级的勾选操作。 ...
### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中,经常会使用到LayUI框架搭建网页应用,尤其是在设计复杂的数据展示界面时,LayUI提供了强大的数据表格功能。然而,在某些场景...
`el-checkbox-group` 是一个容器,用于管理多个 `el-checkbox` 组件,而 `el-checkbox` 则是具体的单个复选框元素。在实现三级复选框时,通常需要处理嵌套关系,即一个复选框的选择可能会影响其子复选框的状态。 ...
带CheckBox和级联操作的Tree 带CheckBox和级联操作的Tree 带CheckBox和级联操作的Tree