基于java SSM框架的学籍管理系统

程序猿大波

已于 2022-02-20 18:58:19 修改

阅读量907

点赞数 1

分类专栏： Java 文章标签： java intellij idea 后端 mysql spring boot

于 2022-02-18 10:08:19 首次发布

本文链接：https://blog.csdn.net/qq_28245905/article/details/122997348

版权

Java 专栏收录该内容

104 篇文章 17 订阅

订阅专栏

今天介绍的是一个基于SSM框架和LayUI的学籍管理系统，功能完善、界面美观。

开发环境

IDEA、MySql5.7、tomcat8、maven3.6

实现功能

分为管理员、教师和学生三种角色，实现了专业管理、班级管理、学籍管理、老师管理、课程管理和用户管理，相关信息可以打印到excel。

添加学生信息JSP页面

<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${basePath}static/lib/layui-src/css/layui.css" media="all">
    <link rel="stylesheet" href="${basePath}static/lib/font-awesome-4.7.0/css/font-awesome.min.css" media="all">
    <link rel="stylesheet" href="${basePath}static/css/style.css" media="all">
    <script type="text/javascript">
    </script>
<body>
<div class="layuimini-container layuimini-page-anim">
    <div class="layuimini-main width_60">
        <form class="layui-form">
            <div class="layui-form-item">
                <label class="layui-form-label">所属专业</label>
                <div class="layui-input-block">
                    <select name="subjectId" lay-filter="subjectId" lay-verify="required">
                        <option value="">请选择</option>
                        <c:forEach items="${subjectList}" var="subject">
                            <option value="${subject.id}">${subject.subjectName}</option>
                        </c:forEach>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">班级</label>
                <div class="layui-input-block">
                    <select name="clazzId" id="clazzId" lay-filter="clazzId" lay-verify="required">
                        <option value="">请选择</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">入学时间</label>
                <div class="layui-input-block">
                    <input type="text" name="joinDate" autocomplete="off" lay-verify="date"  placeholder="yyyy-MM-dd" id="joinDate" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">学号</label>
                <div class="layui-input-block">
                    <input type="text" name="stuNo" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="stuName" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">密码</label>
                <div class="layui-input-block">
                    <input type="text" name="stuPwd" class="layui-input" value="123456">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">身份证号</label>
                <div class="layui-input-block">
                    <input type="text" name="cardNo" value="123123123123123123" lay-verify="identity" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">性别</label>
                <div class="layui-input-block">
                    <select name="gender" lay-verify="required">
                        <option value="男">男</option>
                        <option value="女">女</option>
                        <option value="不详">不详</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">手机号码</label>
                <div class="layui-input-block">
                    <input type="text" name="phone" value="18533333333" lay-verify="phone" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">父母姓名</label>
                <div class="layui-input-block">
                    <input type="text" name="pname" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">联系电话</label>
                <div class="layui-input-block">
                    <input type="text" name="telephone" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label">家庭地址</label>
                <div class="layui-input-block">
                    <input type="text" name="addr" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-block">
                    <button class="layui-btn layui-btn-primary layui-btn-sm data-add-btn">
                        <i class="fa fa-refresh"></i>
                        重置
                    </button>
                    <button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-submit lay-filter="save">
                        <i class="fa fa-save"></i>
                        保存
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
<script src="${basePath}static/lib/layui-src/layui.js" charset="utf-8"></script>
<script src="${basePath}static/js/lay-config.js?v=2.0.0" charset="utf-8"></script>
<script>
    layui.use(['form','jquery','laydate'], function () {
        var form = layui.form,$ = layui.jquery,laydate=layui.laydate;
        laydate.render({
            elem:"#joinDate"
        });
        //获取窗口索引
        var index = parent.layer.getFrameIndex(window.name);
        //监听提交
        form.on('submit(save)', function (data) {
            console.log(data);
            $.ajax({
                url:"${basePath}student/create",
                type:"POST",
                contentType:'application/json',
                dataType:'json',
                data:JSON.stringify(data.field),
                success:function(data){
                    layer.msg(data.msg,{time:500},
                        function(){
                            parent.layer.close(index);
                        });
                }
            });
            return false;
        });

        // 当点击专业之后，查询这个专业下面对应的班级
        form.on('select(subjectId)', function (data) {
            $('#clazzId').empty();
            if(data.value != ''){
                $.ajax({
                    url:"${basePath}clazz/query",
                    type:"POST",
                    dataType:'json',
                    data:{"subjectId":data.value},
                    success:function(data){
                        $('#clazzId').append('<option value="">请选择</option>');
                        data.data.forEach(function(value,index,array){
                            $('#clazzId').append('<option value='+value.id+'>'+value.clazzName+'</option>');
                        });
                        form.render();
                    }
                });
            }

        });
    });
</script>
</body>
</html>

演示视频

基于SSM框架的学籍管理系统

程序猿大波

关注

1
点赞
踩
10

收藏

觉得还不错? 一键收藏
3
评论
基于java SSM框架的学籍管理系统

今天介绍的是一个基于SSM框架和LayUI的学籍管理系统，功能完善、界面美观。开发环境IDEA、MySql5.7、tomcat8、maven3.6实现功能分为管理员、教师和学生三种角色，实现了专业管理、班级管理、学籍管理、老师管理、课程管理和用户管理，相关信息可以打印到excel。添加学生信息JSP页面<html><head> <title>Title</title> <li
复制链接

扫一扫