学生信息管理系统(一)

   寒假跟思途教育学了一周的Java实训课,学了一个简单的系统的制作,主要做了部门和员工,实际五天讲了只有部门一个类的增删查改。上完课后突发奇想,想总结一下几天学的东西,并写一个正式点的系统,于是选定学生信息管理系统。

  首先自己做了一个word,把该实现的类,属性和方法都整理出来,具体现在想到的还很简单,主要涉及的依旧是增删查改,具体的文件如下。

  先把文件基础的方法写出来后,后期再考虑加功能。

 

 

编译器选用的是 STS  (一种改进的Eclipese, 写框架很舒服)

应用的框架是 Springboot

前端的页面是用的 layui 的模板改的功能。

 

先放一个管理员的界面,目前管理员界面的基础功能代码已全部实现。

 

 

目前为止每个功能都可以实现,用时两天,第一天把所有的java后台代码写完,第二天开始改模板,然后前后端相连,其中觉得最麻烦的应该是前后端相连,因为Js代码有一点错就不能运行,还必须从网页上找错。 

首先这是将管理员的java代码

Model 类

package com.sdau.student.admin.model;

public class Adminmodel {
	private String code;
	private String name;
	private String pass;
	public String getCode() {
		return code;
	}
	public void setCode(String code) {
		this.code = code;
	}
	public String getName() {
		return name;
	}
	public void setName(String name) {
		this.name = name;
	}
	public String getPass() {
		return pass;
	}
	public void setPass(String pass) {
		this.pass = pass;
	}
	
	

}

 连接数据库的Mapper

package com.sdau.student.admin.mapper;

import org.apache.ibatis.annotations.Delete;
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
import org.apache.ibatis.annotations.Update;

import com.sdau.student.admin.model.Adminmodel;

//数据层  操作数据库

@Mapper
public interface Adminmapper {
	
	@Insert("insert into admin(code,name,pass) value(#{code},#{name},#{pass})")
	public int insert(Adminmodel model);
	
	@Delete("delete from admin where code=#{code}")
	public int delete(Adminmodel model);
	
	@Update("update admin set name=#{name},pass=#{pass} where code=#{code}")
	public int update(Adminmodel model);
	
	@Select("select * from admin where code=#{code}")
	public Adminmodel select(Adminmodel model);   

}

Service业务逻辑层

package com.sdau.student.admin.service;




import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;

import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import com.sdau.student.admin.mapper.Adminmapper;
import com.sdau.student.admin.model.Adminmodel;
import com.sdau.student.student.model.Studentmodel;
import com.sdau.student.student.service.Studentservice;


//业务逻辑层

@Service
public class Adminservice {
	
	@Autowired
	private Adminmapper mapper;
	
	@Autowired
	private Studentservice service;
	
	
	//注册用户,管理员不能自己实现
	public int insert(Adminmodel model) {
		//输入的code为空 返回3
		String code = model.getCode();
		if (code == null || "".equals(code)) {
			return 3;
		}
		// 数据库中存在code 不能插入 返回2
		//插入返回1;
		Adminmodel m0 = new Adminmodel();
		m0.setCode(code);
		Adminmodel dbp = mapper.select(m0);
		if (dbp == null) {
			return mapper.insert(model);
		} else {
			return 2;
		}
	}
	
	//删除用户,管理员不能自己实现
	public int delete(Adminmodel model) {
		return mapper.delete(model);
	}
	
	//管理员更改个人信息操作
	public int update(Adminmodel model) {
		Adminmodel m0=new Adminmodel();
		m0.setCode(model.getCode());
		Adminmodel aa=mapper.select(m0);
		if(aa==null) {
			return  2;
		}else {
			return mapper.update(model);
		}
	}
	
	//管理员登录操作
	public int login(Adminmodel model) {
		Adminmodel m0=new Adminmodel();
		m0.setCode(model.getCode());
		Adminmodel aa=mapper.select(m0);
		//null 为没有数据 不能登录
		if(aa==null) {
			return 0;
		}
		//返回1 登录成功
		//返回2 密码错误
		if(aa.getPass().equals(model.getPass())) {
			return 1;
		}else {
			return 2;
		}
	}


	

	

}

 

Controller 控制层:

package com.sdau.student.admin.controller;

import java.util.HashMap;
import java.util.Map;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import com.github.pagehelper.PageInfo;
import com.sdau.student.admin.model.Adminmodel;
import com.sdau.student.admin.service.Adminservice;
import com.sdau.student.course.model.Coursemodel;
import com.sdau.student.course.service.Courseservice;
import com.sdau.student.score.model.Scoremodel;
import com.sdau.student.score.service.Scoreservice;
import com.sdau.student.student.model.Studentmodel;
import com.sdau.student.student.service.Studentservice;

//控制层 (接受请求,获取参数,封装对象,调用方法,返回结果)

@Controller
@RequestMapping("admin")
public class Admincontroller {
	
	@Autowired
	private Adminservice service;
	@Autowired
	private Courseservice service1;
	@Autowired
	private Studentservice service3;
	@Autowired
	private Scoreservice service4;
	
	
	@RequestMapping("/test")
	@ResponseBody
	public String test() {
		return "123456";
	}
	
	@RequestMapping("update")
	@ResponseBody
	public Map<String,Object> update(Adminmodel model) {
		Map<String,Object> map=new HashMap<>();
		map.put("code", service.update(model));
		return map;
	}
	
	@RequestMapping("login")
	@ResponseBody
	public Map<String,Object> login(Adminmodel model){
		Map<String, Object> map=new HashMap<>();
		map.put("code",service.login(model));
		return map;
	}
	
	//对课程进行操作
	
	//插入课程
	@RequestMapping("addcourse")
	@ResponseBody
	public Map<String,Object> addcourse(Coursemodel model){
		Map<String,Object> map=new HashMap<>();
		map.put("code", service1.addcourse(model));
		return map;
	}
	
	//删除课程
	@RequestMapping("deletecourse")
	@ResponseBody
	public Map<String,Object> deletecourse(Coursemodel model){
		Map<String,Object> map=new HashMap<>();
		map.put("code", service1.deletecourse(model));
		return map;
	}
	
	//修改课程
	@RequestMapping("updatecourse")
	@ResponseBody
	public Map<String,Object> update(Coursemodel model){
		Map<String,Object> map=new HashMap<>();
		map.put("code", service1.update(model));
		return map;
	}
	
	//通过课程号查找课程
	@RequestMapping("selectbycode")
	@ResponseBody
	public Map<String,Object> selectbycode(Coursemodel model){
		Map<String,Object> map=new HashMap<>();
		map.put("code", service1.selectbycode(model));
		return map;
	}
	
	//根据课程名查找课程
	@RequestMapping("selectbyname")
	@ResponseBody
	public Map<String,Object> selectbyname(Coursemodel model){
		Map<String,Object> map=new HashMap<>();
		map.put("code", service1.selectbyname(model));
		return map;
	}
	
	
	//根据老师查找课程
		@RequestMapping("selectbyteacher")
		@ResponseBody
		public Map<String,Object> selectbyteacher(Coursemodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service1.selectbyteacher(model));
			return map;
		}
		
		
	//对学生操作
		
		//增加学生
		@RequestMapping("addstu")
		@ResponseBody
		public Map<String,Object> addstu(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.addstu(model));
			return map;
		}
		
		//修改学生密码
		@RequestMapping("updatepass")
		@ResponseBody
		public Map<String,Object> updatepass(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.updatepass(model));
			return map;
		}
		
		//修改学生基本信息
		@RequestMapping("updateinfo")
		@ResponseBody
		public Map<String,Object> updateinfo(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.updateinfo(model));
			return map;
		}
		
		//删除学生
		@RequestMapping("deletestu")
		@ResponseBody
		public Map<String,Object> deletestu(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.deletestu(model));
			return map;
		}
		
		//查询学生
		//通过学号查找学生
		@RequestMapping("selectstubycode")
		@ResponseBody
		public Map<String,Object> selectbycode(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.selectbycode(model));
			return map;
		}
		
		//根据学生姓名查找学生
		@RequestMapping("selectstubyname")
		@ResponseBody
		public Map<String,Object> selectstubyname(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.selectbyname(model));
			return map;
		}
		
		//根据专业查找学生
		@RequestMapping("selectstubymajor")
		@ResponseBody
		public Map<String,Object> selectstubymajor(Studentmodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code", service3.selectbymajor(model));
			return map;
		}
		
		
		//课程分数操作
		
		//添加学生成绩
		@RequestMapping("addscore")
		@ResponseBody
		public Map<String,Object> addscore(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.insert(model));
			return map;
		}
		
		//删除学生课程成绩
		@RequestMapping("deletescore")
		@ResponseBody
		public Map<String,Object> deletescore(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.delete(model));
			return map;
		}
		
		//查询学生成绩
		@RequestMapping("selectstuscore")
		@ResponseBody
		public Map<String,Object> selectstu(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.selectstu(model));
			return map;
		}
		
		//查询课程成绩
		@RequestMapping("selectcoursescore")
		@ResponseBody
		public Map<String,Object> selectcourse(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.selectcourse(model));
			return map;
		}
		
		@RequestMapping("selectscore")
		@ResponseBody
		public Map<String,Object> selectscore(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.select(model));
			return map;
		}
		
		//修改学生成绩
		@RequestMapping("updatescore")
		@ResponseBody
		public Map<String,Object> updatecourse(Scoremodel model){
			Map<String,Object> map=new HashMap<>();
			map.put("code",service4.update(model));
			return map;
		}
		
		
		
		
		@RequestMapping("selectpage")
		@ResponseBody
		public Map<String, Object> selectPage(Studentmodel model, int page,int limit) {
			PageInfo<Studentmodel>info=service3.selectPage(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		
		@RequestMapping("selectpage1")
		@ResponseBody
		public Map<String, Object> selectPage1(Studentmodel model, int page,int limit) {
			PageInfo<Studentmodel>info=service3.selectPage1(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		
		@RequestMapping("selectpage2")
		@ResponseBody
		public Map<String, Object> selectPage2(Studentmodel model, int page,int limit) {
			PageInfo<Studentmodel>info=service3.selectPage2(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		//课程名
		@RequestMapping("selectpage3")
		@ResponseBody
		public Map<String, Object> selectPage3(Coursemodel model, int page,int limit) {
			PageInfo<Coursemodel>info=service1.selectPage(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		//课程号
		@RequestMapping("selectpage4")
		@ResponseBody
		public Map<String, Object> selectPage4(Coursemodel model, int page,int limit) {
			PageInfo<Coursemodel>info=service1.selectPage1(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		//任课教师
		@RequestMapping("selectpage5")
		@ResponseBody
		public Map<String, Object> selectPage5(Coursemodel model, int page,int limit) {
			PageInfo<Coursemodel>info=service1.selectPage2(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		
		@RequestMapping("selectpage6")
		@ResponseBody
		public Map<String, Object> selectPage6(Scoremodel model, int page,int limit) {
			PageInfo<Scoremodel>info=service4.selectPage(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
		
		@RequestMapping("selectpage7")
		@ResponseBody
		public Map<String, Object> selectPage7(Scoremodel model, int page,int limit) {
			PageInfo<Scoremodel>info=service4.selectPage1(model, page, limit);
			Map<String, Object> res = new HashMap<>();
			res.put("data", info.getList());
			res.put("count", info.getTotal());
			res.put("code", 0);
			return res;
		}
	
	
	
	

}

前端代码比较复杂且比较多,只放几个主要应用的代码:

主页面:

<%@ page language="java" contentType="text/html; charset=Utf-8"
    pageEncoding="Utf-8"%>
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <title>管理员操作页面</title>
  <link rel="stylesheet" href="/student/layui/css/layui.css" media="all">
  <script src="/student/layui/layui.all.js" type="text/javascript"></script>
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo">管理员操作</div>
    <!-- 头部区域(可配合layui已有的水平导航) -->
<!--     <ul class="layui-nav layui-layout-left"> -->
<!--       <li class="layui-nav-item"><a href="">控制台</a></li> -->
<!--       <li class="layui-nav-item"><a href="">商品管理</a></li> -->
<!--       <li class="layui-nav-item"><a href="">用户</a></li> -->
<!--       <li class="layui-nav-item"> -->
<!--         <a href="javascript:;">其它系统</a> -->
<!--         <dl class="layui-nav-child"> -->
<!--           <dd><a href="">邮件管理</a></dd> -->
<!--           <dd><a href="">消息管理</a></dd> -->
<!--           <dd><a href="">授权管理</a></dd> -->
<!--         </dl> -->
<!--       </li> -->
<!--     </ul> -->
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
       <a>
       <img src="/student/img/admin.jpg" class="layui-nav-img">
        Admin  </a>
       
        <dl class="layui-nav-child">
          <dd><a href="javascript:openUrl('/student/main/404.jsp');">基本资料</a></dd>
          <dd><a href="">修改信息</a></dd>
          <dd><a href="">修改密码</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a href="/student/Admin/login.jsp">注销</a></li>
    </ul>
  </div>
  
  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
      <!-- 左侧导航区域(可配合layui已有的垂直导航) -->
      <ul class="layui-nav layui-nav-tree"  lay-filter="test">
        <li class="layui-nav-item">
          <a class="" href="javascript:;">学生信息管理</a>
          <dl class="layui-nav-child">
            <dd><a href="javascript:openUrl('/student/Admin/addstu.jsp');">增加学生信息</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectstucode.jsp');">通过学号搜索学生信息</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectstu.jsp');">通过姓名查找学生信息</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectstumajor.jsp');">通过专业查找学生信息</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item" >
          <a href="javascript:;">课程信息管理</a>
          <dl class="layui-nav-child">
            <dd><a href="javascript:openUrl('/student/Admin/addcourse.jsp');">增加课程</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectcoursecode.jsp');">通过课程号搜索课程</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectcoursename.jsp');">通过课程名搜索课程</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectcourseteacher.jsp');">通过任课教师搜索课程</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item">
          <a href="javascript:;">学生成绩管理</a>
          <dl class="layui-nav-child">
            <dd><a href="javascript:openUrl('/student/Admin/addscore.jsp');">输入学生成绩</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectscorestu.jsp');">查看学生课程成绩</a></dd>
            <dd><a href="javascript:openUrl('/student/Admin/selectscorecourse.jsp');">查看学科成绩</a></dd>
          </dl>
        </li>
        <li class="layui-nav-item"><a href="">云市场</a></li>
        <li class="layui-nav-item"><a href="">休息一下</a></li>
      </ul>
    </div>
  </div>
  
  <div class="layui-body">
    <!-- 内容主体区域 -->
  <!--   <div style="padding: 15px;"> -->
  
    <iframe  src="/student/main/404.jsp" name="frameA" width="98%" height="98%" >
    </iframe>
     </div>
  </div>
  
  <div class="layui-footer">
    <!-- 底部固定区域 -->
    © 欢迎登录
  </div>
</div>
<script>
//JavaScript代码区域
function  openUrl(url){
         window.open(url,"frameA")
	   }

layui.use('element', function(){
  var element = layui.element;
  element.render();
});
</script>
</body>
</html>

 增加学生页面:

<%@ page language="java" contentType="text/html; charset=Utf-8"
    pageEncoding="Utf-8"%>
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>添加学生信息</title>
		<link rel="stylesheet" href="/student/layui/css/layui.css" media="all">
        <script src="/student/layui/layui.all.js" type="text/javascript"></script>
	</head>
	<body>
		<fieldset class="layui-elem-field" >
			<legend style="font-size: 16px" >添加学生</legend>
			
			<div class = "layui-field-box" > 
				<form class="layui-form" >
					<div class="layui-form-item" >
						<label class="layui-form-label">学号</label>
						<div class="layui-input-inline">
							<input type="text" name="code"  class=" layui-input" lay-verify="required"
								autocomplete="off" placeholder="请输入学号" >
						</div>
						</div>
						<div class="layui-form-item" >
						<label class="layui-form-label">姓名</label>
						<div class="pos2 layui-input-inline">
							<input type="text" name="name" class="layui-input" lay-verify="required"
								autocomplete="off" placeholder="请输入姓名" >
						</div>
					</div>
					<div class="layui-form-item" style="width: 70%">
						<label class=" layui-form-label"> 密码</label>
						<div class=" layui-input-inline">
							<input type="password" name="pass" class="layui-input"  lay-verify="required"
								autocomplete="off" placeholder="请输入密码" >
						</div>
					</div>
					<div class="layui-form-item">
					    <label class="layui-form-label">性别</label>
					    <div class="layui-input-inline">
					    	<input type="radio" name="sex" value="男" title="男" checked="">
					    	<input type="radio" name="sex" value="女" title="女">
					    </div>
					    </div>
					    <div class="layui-form-item">
					    <label class="layui-form-label">年龄</label>
						<div class="pos2 layui-input-inline">
							<input type="text" name="age" class="layui-input" lay-verify="required|number"
								autocomplete="off" placeholder="请输入年龄" >
						</div>
					</div>
					<div class="layui-form-item" >
						<label class="layui-form-label">联系方式</label>
						<div class="layui-input-inline">
							<input type="text" name="tel"  class=" layui-input" lay-verify="required|phone"
								autocomplete="off" placeholder="请输入联系方式" >
						</div>
						</div>
						<div class="layui-form-item" >
						<label class="layui-form-label">邮箱</label>
						<div class="pos2 layui-input-inline">
							<input type="text" name="email" class="layui-input" lay-verify="required|email"
								autocomplete="off" placeholder="请输入邮箱" >
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">专业</label>
						<div class="layui-input-inline">
							<select id="major" name="major" lay-filter="major" lay-verify="required">
								<option value="">请选择专业</option>
								<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="pos2 layui-input-inline" >
							<select id="num" name="num"  lay-verify="required" lay-search="">
								<option value="">请选择班级</option>
								<option value="1">1</option>
								<option value="2">2</option>
								<option value="3">3</option>
								<option value="4">4</option>
								<option value="5">5</option>
							</select>
						</div>
					</div>
					<div class="layui-form-item">
					    <div class="layui-input-block" >
					    	<input value="添加" type="button" class="layui-btn" lay-submit lay-filter="add"/>
					    	<input value="重置" type="reset" class="layui-btn layui-btn-primary"  style="margin-left: 15%"/>
					    </div>
	  				</div>
				</form>
			</div>
		</fieldset>
		
		<script type="text/javascript">
			function refresh(){
				window.location.reload();
			}
			var $ = layui.jquery;//可以使用自己的jquery 也可以是使用layui里面内置的jquery
			var layer = layui.layer;
			var form = layui.form;
			
			form.render();
			form.on("submit(add)",function(data){
				//console.info(dd);//在网页控制台得到调试信息
// 				var d0=data.field;
				$.ajax({
					url:"/student/student/addstu",
					data: data.field,
					dataType:"json",
					type:"post",
					success:function(d){
						console.log(d);//在网页控制台得到调试信息
						if(d.code==1){
							layer.msg('添加成功',refresh);
						} else if(d.code==2){
							layer.msg('学生信息已存在');
						} else {
							layer.msg('添加失败');
						}
					}
				})
			});//添加事件的监听
			
			$.ajax({
				url:"/student/major/selectList",
				data: "",
				dataType:"json",
				type:"post",
				success:function(data){
					//console.log(data.field);//在网页控制台得到调试信息
					$.each(data.selectMajor,function(){
						$("#major").append('<option value="'+this.major+'">'+this.major+'</option>');
					})
					form.render();
				}
			})
		</script>
	</body>
</html>

 根据姓名查询页面:

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>根据学号查询学生信息</title>
 <link rel="stylesheet" href="/student/layui/css/layui.css" media="all">
  <script src="/student/layui/layui.all.js" type="text/javascript"></script>
</head>
<body>
<fieldset class="layui-elem-fied layui-filed-title" style="margin-top: 0px; padding: 5px">
<legend>信息列表</legend>
<table id="demo" lay-filter="test"></table>
</fieldset>
<script type="text/html" id="toolDemo">
<a class="layui-btn layui-btn-xs" lay-event="upd">编辑</a>
<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="pass">修改密码</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script type="text/html" id="toolbarDemo">
<div class="layui-input-inline" style="width:200px;">
<input type="text" name="name" placeholder="请输入名称" class="layui-input" autocomplete="off">
</div>
<button class="layui-btn layui-btn-sm" lay-event="sel">查询</button>
<button class="layui-btn layui-btn-sm" lay-event="add">添加</button

</script>
<script type="text/javascript">
var table=layui.table;
table.render({
	elem:'#demo',
	url:'/student/admin/selectpage',
	toolbar:'#toolbarDemo',//开启头部工具栏,并为其绑定左侧模板
	height:'ful-100',
	page:true,//开启分页
	cols:[[//表头
		{type:'numbers',title:'序号'},
		{field:'code',title:'学号',width:'10%'},
		{field:'name',title:'姓名',width:'10%'},
		{field:'pass',title:'密码',width:'10%'},
		{field:'sex',title:'性别',width:'10%'},
		{field:'age',title:'年龄',width:'10%'},
		{field:'tel',title:'联系方式',width:'10%'},
		{field:'email',title:'邮箱',width:'10%'},
		{field:'major',title:'专业',width:'10%'},
		{field:'num',title:'班级',width:'10%'},
        {title:'操作',width:'20%',toolbar:'#toolDemo'}
		]]
});//渲染
var $=layui.jquery;
var layer=layui.layer;
table.on("toolbar(test)",function(d){
  var event=d.event;
  switch(event){
  case 'sel': //查询
	  table.reload('demo',{
           where:{
                name: $('input[name="name"]').val()
               }
      ,page: {
          curr:1
          }
		  });
	  break;
  case 'add': //添加
	  
	  layer.open({
		  type:2,
		  area:['600px','450px'], //大小
		  maxmin:true,      //最大化最小化
		  end:refresh,     //结束后刷新
		  content:"/student/Admin/addstu.jsp"   //跳转添加界面
		  
		  });
	  break;
  }
});
function refresh(){
     $('button[lay-event="sel"]').click();   //重新点一下查询
}
table.on("tool(test)",function(obj){
        var data=obj.data;
        var code=data.code;
        var layEvent=obj.event;
        switch(layEvent){
        case 'upd' :
        	layer.open({
      		  type:2,
      		  area:['600px','450px'], //大小
      		  maxmin:true,
      		  end:refresh,
      		  content:"/student/Admin/update_student.html?code="+code   //跳转更新界面
      		  });
            break;

        case 'del':  
        	layer.confirm('确认删除该数据?', {icon: 3, title:'提示'}, function(index){
        		  //do something
        		 // layer.msg("数据删除");
        		  $.ajax({
        				 url:"/student/admin/deletestu",//请求路径
        					data:"code="+code,
        					dataType:"json",//请求返回数据类型
        					type:"post",//请求方式 post get
        					success:function(d){//请求成功返回数据时调用方法
        						console.log(d);//{"code":1}
        						if(d.code==1){
                                     layer.msg("删除成功",refresh);
            						}else {
                                          layer.msg("删除失败");
                						}
        					}
        		  });
        		});
            break;
        case 'pass':
        	layer.open({
        		  type:2,
        		  area:['600px','450px'], //大小
        		  maxmin:true,
        		  end:refresh,
        		  content:"/student/Admin/updpass.jsp?code="+code   //跳转更新界面
        		  });
              break;
        }	
})



</script>
</body>
</html>

修改信息页面(放一个修改密码)

<%@ page language="java" contentType="text/html; charset=Utf-8"
    pageEncoding="Utf-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="Utf-8">
<title>Insert title here</title>
<link rel="stylesheet" href="/student/layui/css/layui.css" media="all">
<script src="/student/layui/layui.all.js" type="text/javascript"></script>
</head>
<body>
<fieldset class="layui-elem-field">
  <legend>修改密码页面</legend>
	<div class="layui-field-box">
	<form class="layui-form">
    <div class="layui-form-item">
     <label class="layui-form-label">学号</label>
       <div class="layui-input-inline">
              <input type="text" name="code" required 
                  lay-verify="required" placeholder="请输入学号" autocomplete="off" class="layui-input" readonly="readonly"> 
         </div>
     </div>
        <div class="layui-form-item">
         <label class="layui-form-label">姓名</label>
         <div class="layui-input-inline">
	         <input type="text" name="name" required 
                  lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input" readonly="readonly">
           </div>
      </div>
		  <div class="layui-form-item">
         <label class="layui-form-label">密码</label>
         <div class="layui-input-inline">
	         <input type="password" name="pass" required 
                  lay-verify="required" placeholder="请输入密码" autocomplete="off" class="layui-input">
           </div>
           
      </div>
      <div class="layui-form-item">
		<div class="layui-input-block">
		<input type="button" value="修改"  class="layui-btn" lay-submit lay-filter="reg">
		<input type="reset" class="layui-btn layui-btn-primary" value="重置">
		<input type="button" class="layui-btn" value="取消"  onclick="closethis()">
		</div></div>
	</form>
	</div>
	</fieldset>


<script type="text/javascript">
//返回键
function closethis(){
	   var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
	   parent.layer.close(index); //再执行关闭  
    }
  //获取数据
   var code='<%=request.getParameter("code")%>';
   var $=layui.jquery;
   var form=layui.form;
   var layer=layui.layer;
   $.ajax({
		 url:"/student/admin/selectstubycode",//请求路径
			data:"code="+code,
			dataType:"json",//请求返回数据类型
			type:"post",//请求方式 post get
			success:function(d){//请求成功返回数据时调用方法
			$("input[name='code']").val(d.code.code);
			$("input[name='name']").val(d.code.name);
			$("input[name='pass']").val(d.code.pass);			
			}
		 });
	 //修改数据
	  form.on("submit(reg)",function(data){
		 console.log(data);
		 var da=data.field; //{name:value}{"code":a1,"name":a2,"pass":pass}
	
		 
		 $.ajax({
			 url:"/student/admin/updatepass",//请求路径
				data:"code="+da.code+"&pass="+da.pass,
				dataType:"json",//请求返回数据类型
				type:"post",//请求方式 post get
				success:function(d){//请求成功返回数据时调用方法
					console.log(d);//{"code":1}
					if(d.code==1){
						layer.msg("修改成功",closethis);  //不加小括号
					}else {
						layer.msg("修改失败");
					}
				}
			 });
	  });
</script>
</body>
</html>

 

接下来几天会抽时间写一下其余的几个页面,具体问题写完后再考虑添加一些特殊功能。

 

  • 0
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值