SSMとjQueryに基づく学生管理システム

この記事では、jQueryを使用して、フォアグラウンドインターフェイスとバックグラウンドデータの非同期送信を実装することに焦点を当てています。したがって、アクション(コントローラーレイヤーコード)
インターフェイスのみが醜いので、スプレーしないでください...
1.まず、プロジェクトパッケージ構造を指定します:
ここに画像の説明を挿入
poパッケージはエンティティクラスパッケージであり、utilはツールクラスです(フロントエンドインターフェイスへのバックグラウンドデータの出力を担当します)。マッパーパッケージマッピングパッケージには、追加などのさまざまなSQLステートメントとメソッドが含まれています。削除、変更、およびチェック。biz(サービス)パッケージは主にビジネスロジックの準備を担当します。アクションパッケージは、私たちが精通しているコントローラーレイヤーです
。StudentActionコード:

import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import com.action.IStudenAction;
import com.alibaba.fastjson.JSONObject;
import com.biz.IStudentBiz;
import com.po.Clazz;
import com.po.Student;
import com.util.StudentUtil;
@Controller
public class StudentAction implements IStudenAction {
	@Autowired
	private IStudentBiz studentBiz;
	public IStudentBiz getStudentBiz() {
		return studentBiz;
	}
	public void setStudentBiz(IStudentBiz studentBiz) {
		this.studentBiz = studentBiz;
	}
	@RequestMapping(value="save_Student.do")
	public String save(HttpServletRequest request,
			HttpServletResponse response, Student st) {
		int row = studentBiz.save(st);
		if (row > 0) {
			StudentUtil.printString(response, ""+1);
		}else {
			StudentUtil.printString(response, ""+0);
		}
		return null;
	}
	@RequestMapping(value="update_Student.do")
	public String update(HttpServletRequest request,
			HttpServletResponse response, Student st) {
		int row = studentBiz.update(st);
		if (row > 0) {
			StudentUtil.printString(response, ""+1);
		}else {
			StudentUtil.printString(response, ""+0);
		}
		return null;
	}
	@RequestMapping(value="delById_Student.do")
	public String delById(HttpServletRequest request,
			HttpServletResponse response, Integer sid) {
		int row = studentBiz.delById(sid);
		if (row > 0) {
			StudentUtil.printString(response, ""+1);
		}else {
			StudentUtil.printString(response, ""+0);
		}
		return null;
	}
	@RequestMapping(value="findById_Student.do")
	public String findById(HttpServletRequest request,
			HttpServletResponse response, Integer sid) {
		Student st = studentBiz.findById(sid);
		//将学生对象转为json字符串
		String jsonstr = JSONObject.toJSONString(st);
		System.out.println(jsonstr);
		StudentUtil.printString(response, jsonstr);
		return null;
	}
	@RequestMapping(value="findAll_Student.do")
	public String findAll(HttpServletRequest request,
			HttpServletResponse response) {
		List<Student> lsst = studentBiz.findAll();
		String jsonstr = JSONObject.toJSONString(lsst);
		StudentUtil.printString(response, jsonstr);
		return null;
	}
	@RequestMapping(value="doinit_Student.do")
	public String doinit(HttpServletRequest request,
			HttpServletResponse response) {
		List<Clazz> lsca = studentBiz.doinit();
		String jsonstr = JSONObject.toJSONString(lsca);
		StudentUtil.printString(response, jsonstr);
		return null;
	}
	@RequestMapping(value="findPageAll_Student.do")
	public String findPageAll(HttpServletRequest request,
			HttpServletResponse response, Integer page, Integer rows) {
		page = page==null?1:page;
		rows=rows==null?5:rows;
		if (rows > 20) {
			rows = 20;//每页最多20个值
		}
		//此处在biz(service)层查出总行数,与传进来的rows做运算得出最大页数
		int maxPage=studentBiz.findMaxPage(rows);
		if (page > maxPage) {
			page = maxPage;
		}
		List<Student> lsst = studentBiz.findPageAll(page, rows);
		Map<String, Object> map = new HashMap<String, Object>();
		map.put("page", page);
		map.put("rows", rows);
		map.put("lsst", lsst);
		map.put("maxpage", maxPage);
		String jsonstr = JSONObject.toJSONString(map);
		StudentUtil.printString(response, jsonstr);
		return null;
	}
}

utilパッケージのStudentUtilコード:

import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.http.HttpServletResponse;
public class StudentUtil {
	/**
	 * 输出字符串
	 */
	public static void printString(HttpServletResponse response,String str){
		response.setCharacterEncoding("utf-8");
		PrintWriter out = null;
		try {
			out = response.getWriter();
			out.print(str);
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		} finally{
			out.flush();
			out.close();
		}	
	}
}

フロントエンドインターフェースコードstudent.jsp:

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="description" content="This is my page">
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
	 <script type="text/javascript" src="js/jquery-1.9.1.js"></script>
	<script>
	$(function(){
		//获取下拉列表框的值
		$.getJSON("doinit_Student.do",function(lsca){
			for(var i=0;i<lsca.length;i++){
				var clazz=lsca[i];
				$("#classid").append("<option value="+clazz.cid+">"+clazz.cname+"</option>");
			}
		});
		showAll();	
	});
	//显示所有学生列表方法
	var page = 1;
	var maxpage =1;
	var rows = 5;
	function showAll(){
		$.getJSON('findPageAll_Student.do?page='+page+'&rows='+rows,function(map){
				var lsst = map.lsst;
				page=map.page;
				rows=map.rows;
				maxpage = map.maxpage;
				var tablehead="<table width='700' border='1' align='center' cellpadding='1' cellspacing='1'>"
					+"<tr align='center' bgcolor='#FFFF99'>"
					+"<td>编号</td>"
					+"<td>姓名</td>"
					+"<td>性别</td>"
					+"<td>地址</td>"
					+"<td>生日</td>"
					+"<td>班级</td>"
					+"<td>操作</td>"
					+"</tr>";
					var trows="";
					for(var i=0;i<lsst.length;i++){
						var st=lsst[i];
						trows+="<tr align='center'>"
						+"<td>"+st.sid+"</td>"
						+"<td>"+st.sname+"</td>"
						+"<td>"+st.sex+"</td>"
						+"<td>"+st.address+"</td>"
						+"<td>"+st.sdate+"</td>"
						+"<td>"+st.cname+"</td>"
		+"<td><input type='button' value='删除' onclick='dodelete("+st.sid+")'> <input type='button' value='修改' onclick='dofindById("+st.sid+")'></td>"
						+"</tr>"
					}
					
			var endtable=tablehead+trows+"</table>";
			$("#tt").html(endtable);
			$("#rows").val(rows);
			$("#page").val(page);
			$("#pagelale").html(page+"/"+maxpage);
		});
	}
	/********************分页事件********************************/
	$(function(){
		$("#btfirst").click(function(){
			page = 1;
			showAll();
		});
		$("#btup").click(function(){
			page = page- 1;
			if (page < 1) {
				page = 1;
			}
			showAll();
		});
		$("#btnext").click(function(){
			page = page + 1;
			if (page > maxpage) {
				page = maxpage
			}
			showAll();
		});
		$("#btlast").click(function(){
			page = maxpage;
			showAll();
		});
		$("#btrows").click(function(){
			rows=$("#rows").val();
			if (isNaN(rows)) {
				alert("请输入正确的是数字");
				return;
			}
			showAll();
		});
		$("#btpage").click(function(){
			page=$("#page").val();
			if (isNaN(rows)) {
				alert("请输入正确的是数字");
				return;
			}
			showAll();
		});
	});	
	
	
	/********************保存修改事件********************************/
	//保存事件
	$(function(){
		$("#btsave").click(function(){
			//获取表单元素
			var sname = $("#sname").val();
			var sex = $(":radio[name='sex']:checked").val();
			var address = $("#address").val();
			var sdate = $("#sdate").val();
			var cid = $("#classid").val();
			//将获取的表单元素转换成json字符串
			var jsondata = {
				'sname':sname,
				'sex':sex,
				'address':address,
				'sdate':sdate,
				'classid':cid,
			};
			//向服务器发送数保存
			$.post('save_Student.do',jsondata,function(code){
				if (code =='1') {
					alert("b保存成功!");
					showAll();
				} else{
					alert("b保存失败!");
					showAll();
				}
			});
		})
	}); 
	//删除事件
	function dodelete(sid){
		$.get("delById_Student.do?sid="+sid,function(code){
				if (code =='1') {
					alert("删除成功!");
					showAll();
				} else{
					alert("删除失败!");
					showAll();
				}
		})
	}
	//查找事件
	function dofindById(sid){
		$.getJSON("findById_Student.do?sid="+sid,function(st){
			//给文本框赋值
			$("#sid").val(st.sid);
			$("#sname").val(st.sname);
			$(":radio[value="+st.sex+"]").attr("checked",true);
			$("#address").val(st.address);
			$("#sdate").val(st.sdate);
			$("#classid").val(st.classid);
		});
	}
	//更新事件
	$(function(){
		$("#btupdate").click(function(){
			//获取表单元素
			var sid = $("#sid").val();
			var sname = $("#sname").val();
			var sex = $(":radio[name='sex']:checked").val();
			var address = $("#address").val();
			var sdate = $("#sdate").val();
			var cid = $("#classid").val();
			//将获取的表单元素转换成json字符串
			var jsondata = {
				'sid':sid,
				'sname':sname,
				'sex':sex,
				'address':address,
				'sdate':sdate,
				'classid':cid,
			};
			//向服务器发送数保存
			$.post('update_Student.do',jsondata,function(code){
				if (code =='1') {
					alert("b更新成功!");
					showAll();
				} else{
					alert("b保存失败!");
					showAll();
				}
			});
		})
	}); 
</script>
</head>
  <body>
    <p align="center">学生列表</p>
    <hr>
    <div id="tt">
    </div>
     <!-- 分页************************************* -->
 <table width="700" border="1" align="center" cellpadding="1" cellspacing="0">
    <tr align="center" bgcolor="#FFFF99">
      <td bgcolor="#FFFF99"><input type="button" name="btfirst" id="btfirst" value="首页">
      </td>
      <td bgcolor="#FFFF99">
      	  <input type="button" name="btup" id="btup" value="上页">
      	</td>
      <td bgcolor="#FFFF99">
      	<input type="button" name="btnext" id="btnext" value="下页"></td>
      <td bgcolor="#FFFF99">
      	<input type="button" name="btlast" id="btlast" value="末页"></td>
      <td>每页
        <label for="rows"></label>
      <input name="rows" type="text" id="rows" size="2" />
      条记录
      <input type="button" name="btrows" id="btrows" value="确定" onclick="doChangeRows()" /></td>
      <td>跳转到第
        <label for="page"></label>
        <input name="page" value="${pb.page}" type="text" id="page" size="2" />
页
	<input type="button" name="btpage" id="btpage" value="确定" onclick="doChangePage()" /></td>
      <td bgcolor="#FFFF99"><span id="pagelale">1/1页</span></td>
    </tr>
  </table>
    <!-- ************************************** -->
    <hr>
    <form name="form1" method="post">
      <table width="770" border="1" align="center" cellpadding="1" cellspacing="1">
        <tr>
          <td colspan="2" align="center" bgcolor="#FFFF99">学生管理</td>
        </tr>
        <tr>
          <td width="65">姓名</td>
          <td width="372"><input type="text" name="sname" id="sname" /><input type="hidden" name="sid" id="sid" /></td>
        </tr>
        <tr>
          <td>性别</td>
          <td>
          	<input type="radio" name="sex" id="sex0" value="男" checked="checked">男 
          	<input type="radio" name="sex" id="sex1" value="女">女 
          </td>
        </tr>
        <tr>
          <td>地址</td>
          <td><input type="text" name="address" id="address"/></td>
        </tr>
        <tr>
          <td>生日</td>
          
          <td><input type="date" name="sdate" id="sdate" value="1990-01-01"/></td>
        </tr>
        <tr>
          <td>班级</td>
          <td>
          	<select name="classid" id="classid">
          	</select>
          </td>
        </tr>
        <tr>
          <td colspan="2" align="center" bgcolor="#FFFF99">
          <input type="button" id="btsave" value="确定"/>&nbsp;
          <input type="button" id="btupdate" value="修改"/>&nbsp;
          <input type="button" id="btreset" value="重置"/></td>
        </tr>
      </table>
  </body>
</html>

学生の日付には、処理が必要な日付を表示するのに役立つ属性があることに注意してください!自分で解決してください!

おすすめ

転載: blog.csdn.net/lq1759336950/article/details/96287186