|
|
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
|
|
|
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
|
|
|
<html>
|
|
|
<head>
|
|
|
<!-- 设置页面标题为“增加学生”，在浏览器标签页等位置显示该标题 -->
|
|
|
<title>增加学生</title>
|
|
|
<!-- 引入layui的样式文件，layui是一个前端UI框架，该文件用于页面的样式布局等美化 -->
|
|
|
<link rel="stylesheet" href="./css/layui.css">
|
|
|
<!-- 引入自定义的样式文件，可能包含针对本页面特定的样式设置 -->
|
|
|
<link rel="stylesheet" href="./css/style.css">
|
|
|
<!-- 引入layui的JavaScript文件，用于实现layui框架相关的交互功能等 -->
|
|
|
<script src="./layui.js"></script>
|
|
|
<!-- 引入jQuery库的.min压缩版本，jQuery是常用的JavaScript库，方便进行DOM操作、事件处理等 -->
|
|
|
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
|
|
|
</head>
|
|
|
<body class="layui-layout-body" style="background-color: #F2F2F2">
|
|
|
<!-- 包含用于过滤登录状态的JSP页面，可能用于判断用户是否登录等相关逻辑处理 -->
|
|
|
<jsp:include page="/filterLogin.jsp"></jsp:include>
|
|
|
<!-- 包含管理员头部页面，通常包含页面头部的一些通用元素，比如页面标题、导航栏等 -->
|
|
|
<jsp:include page="/WEB-INF/admin/aHeader.jsp"></jsp:include>
|
|
|
<!-- 包含管理员导航栏页面，用于展示管理员操作相关的导航菜单等 -->
|
|
|
<jsp:include page="/WEB-INF/admin/adminNav.jsp"></jsp:include>
|
|
|
<div class="layui-layout layui-layout-admin">
|
|
|
<div class="layui-body">
|
|
|
<!-- 内容主体区域 -->
|
|
|
<div style="padding: 15px;">
|
|
|
<!-- 使用layui的面包屑组件，展示当前页面的层级导航路径 -->
|
|
|
<span class="layui-breadcrumb">
|
|
|
<!-- 面包屑的一级导航，链接指向根路径（此处可能根据实际情况有对应功能） -->
|
|
|
<a href="">管理员</a>
|
|
|
<!-- 面包屑的二级导航，链接指向学生管理相关页面（同样可能有对应功能） -->
|
|
|
<a href="">学生管理</a>
|
|
|
<!-- 面包屑的三级导航，显示当前页面的具体名称 -->
|
|
|
<a><cite>增加学生</cite></a>
|
|
|
</span>
|
|
|
<!-- 定义一个表单，使用layui的表单样式（class="layui-form"），表单提交的目标地址由EL表达式${pageContext.request.contextPath}/addStudentInfoServlet指定，提交方式为POST -->
|
|
|
<form class="layui-form" action="${pageContext.request.contextPath}/addStudentInfoServlet" style="padding-top: 50px" method="post">
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于输入学号 -->
|
|
|
<div class="layui-form-item">
|
|
|
<!-- 该项的标签，显示为“学号” -->
|
|
|
<label class="layui-form-label">学号</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性用于在表单提交时标识该字段，设置为“student-id”，required表示该字段为必填项，lay-verify="required"用于layui框架验证该字段必填，autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-id" required lay-verify="required" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于选择学院 -->
|
|
|
<div class="layui-form-item">
|
|
|
<label class="layui-form-label">学院</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个下拉选择框，name属性设置为“selectCollege”，用于在表单提交时传递所选学院的值 -->
|
|
|
<select name="selectCollege">
|
|
|
<!-- 一个默认被选中的空选项，可能用于占位或者等待用户选择实际学院 -->
|
|
|
<option selected></option>
|
|
|
<!-- 使用JSTL的forEach标签循环遍历名为“collegeLists”的集合（应该是在后台传递过来的学院相关数据集合），为下拉框生成具体的学院选项，选项的值和显示文本都使用集合中对象（collegeList）的“college”属性值 -->
|
|
|
<c:forEach items="${collegeLists}" var="collegeList">
|
|
|
<option value="${collegeList.college}">${collegeList.college}</option>
|
|
|
</c:forEach>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于选择系别 -->
|
|
|
<div class="layui-form-item">
|
|
|
<label class="layui-form-label">系别</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个下拉选择框，name属性设置为“selectDepartment”，lay-search属性开启layui框架的搜索功能（方便在选项较多时查找），用于在表单提交时传递所选系别的值 -->
|
|
|
<select name="selectDepartment" lay-search>
|
|
|
<!-- 一个默认被选中的空选项，可能用于占位或者等待用户选择实际系别 -->
|
|
|
<option selected></option>
|
|
|
<!-- 使用JSTL的forEach标签循环遍历名为“departmentLists”的集合（应该是在后台传递过来的系别相关数据集合），为下拉框生成具体的系别选项，选项的显示文本使用集合中对象（departmentList）的“department”属性值，此处未设置value值，可能默认与显示文本相同 -->
|
|
|
<c:forEach items="${departmentLists}" var="departmentList">
|
|
|
<option>${departmentList.department}</option>
|
|
|
</c:forEach>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于选择班级 -->
|
|
|
<div class="layui-form-item">
|
|
|
<label class="layui-form-label">班级</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个下拉选择框，name属性设置为“selectClass”，lay-search属性开启layui框架的搜索功能（方便在选项较多时查找），用于在表单提交时传递所选班级的值 -->
|
|
|
<select name="selectClass" lay-search>
|
|
|
<!-- 一个默认被选中的空选项，可能用于占位或者等待用户选择实际班级 -->
|
|
|
<option selected></option>
|
|
|
<!-- 使用JSTL的forEach标签循环遍历名为“classLists”的集合（应该是在后台传递过来的班级相关数据集合），为下拉框生成具体的班级选项，选项的显示文本使用集合中对象（classList）的“cclass”属性值，此处未设置value值，可能默认与显示文本相同 -->
|
|
|
<c:forEach items="${classLists}" var="classList">
|
|
|
<option>${classList.cclass}</option>
|
|
|
</c:forEach>
|
|
|
</select>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于输入姓名 -->
|
|
|
<div class="layui-form-item">
|
|
|
<label class="layui-form-label">姓名</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性设置为“student-name”，id属性设置为“student-name”（可用于后续JavaScript操作等），placeholder属性可用于显示提示文本（此处为空），autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-name" id="student-name" placeholder="" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="layui-form-item">
|
|
|
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，包含多个内联的输入项，用于输入性别、年龄、电话、邮箱等信息 -->
|
|
|
<div class="layui-form-item">
|
|
|
<!-- 第一个内联布局块，用于选择性别 -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">性别</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义两个单选按钮，name属性都设置为“student-sex”，表示同一组单选按钮（只能选择一个），id属性分别为“idsex”和“idsex2”用于区分，value属性分别设置为“男”和“女”，title属性用于显示按钮的文本描述 -->
|
|
|
<input type="radio" name="student-sex" id="idsex" value="男" title="男">
|
|
|
<input type="radio" name="student-sex" id="idsex2" value="女" title="女">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 第二个内联布局块，用于输入年龄 -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">年龄</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性设置为“student-age”，id属性设置为“student-age”（可用于后续JavaScript操作等），placeholder属性可用于显示提示文本（此处为空），autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-age" id="student-age" placeholder="" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 第三个内联布局块，用于输入电话 -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">电话</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性设置为“student-phone”，id属性设置为“student-phone”（可用于后续JavaScript操作等），placeholder属性可用于显示提示文本（此处为空），autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-phone" id="student-phone" placeholder="" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 第四个内联布局块，用于输入邮箱 -->
|
|
|
<div class="layui-inline">
|
|
|
<label class="layui-form-label">邮箱</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性设置为“student-email”，id属性设置为“student-email”（可用于后续JavaScript操作等），placeholder属性可用于显示提示文本（此处为空），autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-email" id="student-email" placeholder="" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，用于输入所在城市信息，文本区域样式（layui-form-text） -->
|
|
|
<div class="layui-form-item layui-form-text">
|
|
|
<label class="layui-form-label">城市</label>
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个文本输入框，name属性设置为“student-address”，id属性设置为“student-address”（可用于后续JavaScript操作等），placeholder属性设置为“请输入你所在的省市”用于提示用户输入内容，autocomplete="off"关闭浏览器自动填充功能，class="layui-input"应用layui的输入框样式 -->
|
|
|
<input type="text" name="student-address" id="student-address" placeholder="请输入你所在的省市" autocomplete="off" class="layui-input">
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
<!-- 表单中的一个输入项，对应一个“layui-form-item”样式的布局块，包含提交按钮和重置按钮等操作按钮 -->
|
|
|
<div class="layui-form-item">
|
|
|
<div class="layui-input-block">
|
|
|
<!-- 定义一个提交按钮，class="layui-btn"应用layui的按钮样式，lay-submit属性表示该按钮用于提交表单，lay-filter="formDemo"可用于layui框架对表单提交进行额外的验证等操作，按钮文本为“添加” -->
|
|
|
<button class="layui-btn" lay-submit lay-filter="formDemo">添加</button>
|
|
|
<!-- 定义一个重置按钮，class="layui-btn layui-btn-primary"应用layui的默认样式按钮样式，type="reset"表示点击该按钮会重置表单内容，按钮文本为“重置” -->
|
|
|
<button class="layui-btn layui-btn-primary" type="reset">重置</button>
|
|
|
<!-- 用于显示可能的后台反馈信息（如添加成功、失败等提示信息），通过EL表达式${update_msg}获取相应的值 -->
|
|
|
<span style="padding-left: 20px;">${update_msg}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</form>
|
|
|
<!-- 包含页面底部相关内容的JSP页面，可能包含版权信息、联系方式等通用的底部元素 -->
|
|
|
<jsp:include page="/footer.jsp"></jsp:include>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
|
|
|
<!-- 使用jQuery选择器选择特定的DOM元素（此处可能是导航栏中的某个元素）并添加类名“layui-this”，用于设置样式等相关操作（具体功能取决于对应的CSS样式定义） -->
|
|
|
<script type="text/javascript">
|
|
|
$("#nav li:nth-child(2) dl dd:last-child").addClass("layui-this");
|
|
|
$("#nav li:nth-child(2)").addClass("layui-nav-itemed");
|
|
|
</script>
|
|
|
<!-- 使用layui框架的element模块，进行相关初始化操作，element模块通常用于实现页面的交互元素（如折叠面板、导航栏等）的功能 -->
|
|
|
<script>
|
|
|
//JavaScript代码区域
|
|
|
layui.use('element', function(){
|
|
|
var element = layui.element;
|
|
|
element.init();
|
|
|
});
|
|
|
</script>
|
|
|
<!-- 使用layui框架的form模块，通常用于对表单相关功能进行进一步配置、验证等操作，但目前函数体为空，可能需要补充具体代码 -->
|
|
|
<script>
|
|
|
layui.use('form', function(){
|
|
|
|
|
|
});
|
|
|
</script>
|
|
|
</body>
|
|
|
</html> |
