`

checkbox多选框级联勾选(父类被都选之后相应的子类也被勾选)

    博客分类：
  • js
html 
阅读更多 
<%@ 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()"/>&nbsp;&nbsp;<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()" />&nbsp;&nbsp;<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/>&nbsp;&nbsp;${l.categoryName }</label>					
								</c:when>
								
								<c:otherwise>
									<label><input type="checkbox" flag="${m.categoryId }" id="${l.pid }" name="chk" value="${l.categoryId }" />&nbsp;&nbsp;${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>
分享到：
| sql server2005安装步骤
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics