計算機學院管理系統（3）

學生管理頁面–新增（後端）

1.Controller層

@RequestMapping("insertStu")
	@ResponseBody
	public ModelAndView insertStu(Student student) {
		ModelAndView mav = new ModelAndView();
		int flag = studentService.insertStu(student);
		if (flag == 0) {
			// 新增失敗返回本頁面
			mav.setViewName("student-add");
		} else {
			// 返回使用者列表並查詢資料
			mav = selectUserView();
		}
		return mav;
	}

資料新增成功之後頁面會預設返回值為1，失敗則為0，所以將新增方法賦值給一個int變數，通過該變數判斷新增是否成功。如果成功就引用之前的selectUserView()查詢方法查詢新的資料，失敗就跳轉到“student-add.jsp”新增頁面

2.Service層

int insertStu(Student student);

同查詢，直接在controller層點選紅色下劃線create

3.ServiceImpl層

@Override
	public int insertStu(Student student) {
		// TODO Auto-generated method stub
		return studentDao.insertStu(student);
	}

在Impl層create之後引用Dao層的sql語句方法

4.Dao層

// 新增學生記錄
	@Insert("insert Student values(#{id},#{StudentNum},#{StuClass},#{StudentName},#{sex},#{PhoneNum},#{Address},#{SchoolAddress},#{Rid})")
	int insertStu(Student student);

學生管理頁面–新增（前端）

1.Student-list頁面

給onclick事件新增跳轉路徑，即點選新建跳轉到student-add頁面

2.Student-add頁面

新增頁面寫好表格即可，因為這些表格是在form表單下寫的，所以在點選儲存之後會以post請求的方式把填入的資料返回到後臺的insertStu方法中

3.效果演示

學生管理頁面–修改（後端）

1.Controller層

// 2.修改學生資訊(根據id查詢學生資訊用來修改)
	@RequestMapping("/updateStu")
	@ResponseBody
	public ModelAndView updateStu(Integer id) {
		// 1.獲取要修改的資訊
		Student student = studentService.selectStudentById(id);
		// 2.跳轉到修改頁面
		ModelAndView mav = new ModelAndView();
		mav.setViewName("student-update");
		mav.addObject("student", student);
		return mav;
	}

	// 2.1修改學生資訊並且返回資訊頁面
	@RequestMapping("/updateStuData")
	public ModelAndView updateStuData(Student student) {
		// 1.獲取要修改的資訊
		int flag = studentService.updateStuData(student);
		// 2.跳轉到對應頁面
		ModelAndView mav = new ModelAndView();
		if (flag > 0) {// 修改成功，跳轉到資訊頁面
			mav.setViewName("student-list");
		} else {// 修改失敗，繼續回到修改頁面
			mav.setViewName("student-update");
		}
		return mav;
	}

修改方法分為兩部分，第一部分是根據id查詢學生資訊進行跳轉到修改頁面的操作，第二部分是修改學生資訊之後可以儲存並返回到主頁

2.Service層

	Student selectStudentById(Integer id);

	int updateStuData(Student student);

3.ServiceImpl層

@Override
	public Student selectStudentById(Integer id) {
		// TODO Auto-generated method stub
		return studentDao.selectStudentById(id);
	}

	@Override
	public int updateStuData(Student student) {
		// TODO Auto-generated method stub
		return studentDao.updateStuData(student);
	}

4.Dao層

// 根據id查詢學生記錄
	@Select("select * from Student where id = #{id}")
	Student selectStudentById(Integer id);

	// 修改學生記錄
	@Update("update Student set StudentNum=#{StudentNum},StuClass=#{StuClass},StudentName=#{StudentName},sex=#{sex},PhoneNum=#{PhoneNum},Address=#{Address},SchoolAddress=#{SchoolAddress} where id=#{id}")
	int updateStuData(Student student);

學生管理頁面–修改（前端）

1.Student-list頁面

"<button type = 'button' οnclick='update("+StudenInfo.id+")' class='btn bg-olive btn-xs'>修改</button>"+

//修改,先跳轉到修改頁面
			function update(id){
			//跳轉到修改頁面
			window.location.href= $webName + "/StudenInfo/updateStu?id="+id;
			}

js方法通過頁面中的修改按鈕的onlick事件獲得id，再跳轉到修改頁面，此時id也會被傳值到修改頁面

2.Student-update頁面

3.效果演示

學生管理頁面–刪除（後端）

1.Controller層

// 3.批量刪除學生資訊
	@RequestMapping("/deleteStudent")
	@ResponseBody
	public boolean deleteStudent(Integer[] ids) {
		return studentService.deleteStudent(ids);
	}

	// 4.單行刪除產品
	@RequestMapping("/deleteStudentOne")
	@ResponseBody
	public int deleteStudentOne(Integer id) {
		return studentService.deleteStudentOne(id);
	}

刪除分為多行刪除和單行刪除，其中多行刪除是指頁面中的多選框進行多項選擇再刪除，單行刪除是隻針對一行資料進行的刪除

2.Service層

	boolean deleteStudent(Integer[] ids);

	int deleteStudentOne(Integer id);

3.ServiceImpl層

@Override
	public boolean deleteStudent(Integer[] ids) {
		// TODO Auto-generated method stub
		for (int i = 0; i < ids.length; i++) {
			studentDao.deleteStudent(ids[i]);
		}
		return true;
	}

	@Override
	public int deleteStudentOne(Integer id) {
		// TODO Auto-generated method stub
		return studentDao.deleteStudentOne(id);
	}

這裡的多行刪除跟單行刪除的區別在於多行刪除是把每一行的資料存在陣列中，再依次進行刪除

4.Dao層

// 多行刪除語句
	@Delete("delete from Student where id=#{id}")
	int deleteStudent(int id);

	// 單行刪除語句
	@Delete("delete from Student where id=#{id}")
	int deleteStudentOne(Integer id);

這裡多行刪除跟單行刪除共用一個刪除語句也可以

學生管理頁面–刪除（前端）

1.Student-list頁面

多行刪除

		<button type="button" class="btn btn-default" id="deleteUser" title="刪除"> //多行刪除的按鈕
				<i class="fa fa-trash-o"></i> 刪除
		</button>  


		//批量刪除使用者
			$("#deleteUser").click(function(){ //對id為deleteUser的按鈕的js方法
			var ids = new Array(); 
			$.each($(".checkItem:checked"),function(){ //選擇多選框的方法
			var id =$(this).parents("tr").children("td").eq(1).text(); //這裡意思是將選擇的列的第一排第一個格子中的資料（即學生id）賦值給“id”這個變數
			ids.push(id); //將變數id中的值push（依次放入）陣列變數ids中
		})
		
		if(confirm("確認刪除使用者嗎？")){
			//傳送ajax請求，批量刪除
			$.ajax({
				url:$webName + "/StudenInfo/deleteStudent",
				type:"post",
				data:"ids="+ids, //將變數ids傳遞到後端,所以後端的變數名為ids
				success:function(result){
					alert("刪除成功");
					getUserPageInfo($pageNum,$pageSize); //重新整理頁面
				}
			});
		}
	})

單行刪除

"<button type = 'button' οnclick='deleteUserOne("+StudenInfo.id+")' class='btn bg-olive btn-xs' >刪除</button>"+ //通過onclick事件將id傳值給單行刪除的js方法


		//確認刪除單行使用者
				function deleteUserOne(id){
					if(confirm("確認刪除使用者嗎？")){
						//傳送ajax請求，單行刪除
						$.ajax({
							url:$webName + "/StudenInfo/deleteStudentOne",
							type:"post",
							data:"id="+id,
							success:function(result){
								alert("刪除成功");
								getUserPageInfo($pageNum,$pageSize);
							}
						});
					}
				}

2.效果演示

2.效果演示