数据库交互实现checkedbox选中联动效果
该资源是一个基于Java的JSP页面,用于实现权限管理中的角色与权限分配功能。页面中使用了checkedbox(复选框)来表示权限,实现了选中父权限时,其所有子权限自动被选中,以及选中任一子权限时,其父权限也会自动被选中的功能。此功能适用于从数据库读取数据,如通过`<c:Foreach>`标签遍历列表`${list}`来展示数据,并在用户操作后可以将选中状态添加回数据。 详细知识点: 1. JSP(JavaServer Pages):这是一个动态网页技术,允许开发者在HTML页面中嵌入Java代码,从而实现服务器端的业务逻辑处理。 2. JSTL(JavaServer Pages Standard Tag Library):JSP标准标签库,提供了丰富的标签用于处理常见的JSP任务,如循环、条件判断等。在这个例子中,`<c:forEach>`标签用于遍历集合数据。 3. `checkedbox 选中效果`:在HTML中,`<input type="checkbox">`元素用于创建复选框,`checked`属性表示复选框默认是否被选中。在这个示例中,通过JavaScript函数`checkAll()`和`clearAll()`来实现选中父项时所有子项自动选中,以及取消选中子项时父项自动取消选中的效果。 4. Java表达式(JSP EL):`${list}`是JSP表达式语言(Expression Language)的使用,它用于获取后台Java对象的属性值,如在`<c:forEach items="${list}" var="list">`中遍历名为`list`的集合。 5. `onclick`事件处理:`onclick`是HTML中的一个事件,当用户点击元素时触发。在示例中,`onclick`事件绑定到复选框,调用JavaScript函数来更新其他复选框的状态。 6. JavaScript函数: - `checkAll`函数:这个函数用于选中一组相关联的复选框,可能通过DOM遍历找到特定父项下的所有子项并设置它们的`checked`属性。 - `clearAll`函数:相反,这个函数用于取消选中一组复选框,可能是取消当前选中的父项或子项,以确保与用户的交互保持一致。 7. 数据库交互:虽然没有直接显示数据库交互的代码,但描述中提到"适用于数据库读取c:Foreach ${list}读取数据",这暗示在后端可能有Java代码负责从数据库中获取权限数据并填充到`list`变量中。 8. 表单提交:`<form action="../system/role!add" method="post">`定义了一个表单,提交动作是向`../system/role!add`发送POST请求,这通常用于向服务器发送数据以执行添加角色或权限的操作。 9. CSS样式:虽然示例中没有详细展示CSS,但`common_button`类和`page_title`、`button_bar`、`query_form_table`等类名表明页面使用了CSS进行布局和样式控制,以提供更好的用户体验。 这个页面片段展示了Web开发中常见的技术组合,包括JSP、JSTL、HTML、JavaScript以及后端与前端的交互。在实际项目中,这样的页面通常会配合Servlet或Controller来处理表单提交,并进行数据库操作。
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<body>
<form action="../system/role!add" method="post">
<div class="page_title">
权限管理 > 添加角色
</div>
<div class="button_bar">
<button class="common_button" onclick="back();">
返回
</button>
<input type="submit" class="common_button"
style="width: 45px; height: 22px;" value="保存">
</div>
<table class="query_form_table">
<tr>
<td>
指定权限
</td>
<td>
<c:set value="-1" var="i"></c:set>
<c:forEach items="${list }" var="list">
<c:if test="${list.privilegeId==null}">
<c:set value="${i+1 }" var="i"></c:set>
${list.name } <input type="checkbox"
name="parent[${i }]"
value="${list.id }"
下载后可阅读完整内容,剩余3页未读,立即下载
- 粉丝: 0
- 资源: 3
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
- 李兴华Java基础教程:从入门到精通
- U盘与硬盘启动安装教程:从菜鸟到专家
- C++面试宝典:动态内存管理与继承解析
- C++ STL源码深度解析:专家级剖析与关键技术
- C/C++调用DOS命令实战指南
- 神经网络补偿的多传感器航迹融合技术
- GIS中的大地坐标系与椭球体解析
- 海思Hi3515 H.264编解码处理器用户手册
- Oracle基础练习题与解答
- 谷歌地球3D建筑筛选新流程详解
- CFO与CIO携手:数据管理与企业增值的战略
- Eclipse IDE基础教程:从入门到精通
- Shell脚本专家宝典:全面学习与资源指南
- Tomcat安装指南:附带JDK配置步骤
- NA3003A电子水准仪数据格式解析与转换研究
- 自动化专业英语词汇精华:必备术语集锦