學生信息管理系統----學生信息

回顧前面

  前面我們實現了班級頁面的嵌入，對班級列表的增刪改查。爲了實現這些功能，建立了數據表，數據表對應的model，和Dao。
創建了Servlet，建立了Servlet與訪問地址的映射關係等。
  接下來是對學生信息的管理，其中相同的步驟我打算只是簡單的提一下，畢竟操作和之前都差不多。

  建立新的學生表，在model層創建student.java，其中的屬性要和數據表的字段想對應。然後創建StudentServlet，並在xml中進行訪問地址的映射。

讀取學生信息

  這裏涉及Servlet層和Dao層的方法，下面給出了對應。
Servlet —>getStudentList
StudentDao —>getStudentList

  Dao中會涉及到一個多條件查詢，即姓名和班級兩個條件下對學生信息進行檢索。

....
String sql = "select * from s_student ";
if(!StringUtil.isEmpty(student.getName())){
	sql += "and name like '%" + student.getName() +"%'";
}
if(student.getClazzId() != 0){
	sql += " and clazz_id = " +student.getClazzId() ;
}
sql += " limit " + page.getStart() +","+page.getPageSize();
ResultSet resultSet = query(sql.replaceFirst("and", "where"));
....

  目的是根據所獲取的班級id和學生信息進行查詢，按照不一樣的條件來對sql語句進行拼接。如果所傳的信息中，上面的兩個if只有一個能夠執行，那麼if中就將這個條件加入進去，在後面執行的時候，再將and替換爲where達到目的。
  如果兩個if條件都滿足了，那麼在拼接結果中就會出現兩個and，此時我們就將第一個and替換爲where。

  再來看看Servlet中的部分代碼

	private void getStudentList(HttpServletRequest req, HttpServletResponse res) {
		res.setCharacterEncoding("utf-8");
		res.setContentType("text/html;charset=utf-8");
		String name = req.getParameter("studentName");
		Integer currentPage = req.getParameter("page") == null ? 1:Integer.parseInt(req.getParameter("page"));
		Integer pageSize = req.getParameter("rows") == null?999:Integer.parseInt(req.getParameter("rows"));
		Integer clazz = req.getParameter("clazzid") == null?0:Integer.parseInt(req.getParameter("clazzid"));
		Student student = new Student();
		student.setName(name);
		student.setClazzId(clazz);
		
		StudentDao studentDao = new StudentDao();
		List<Student> clazzList = studentDao.getStudentList(student, new Page(currentPage, pageSize));
		studentDao.closeCon();
		int total = studentDao.getStudentListTotal(student);
		studentDao.closeCon();
....

	}

  這裏也是先在前臺接受數據，保存到student中，將其中的屬性傳給StudentDao的getStudentList做參數判斷。

  其中也有一個total變量來計算在條件查詢下的數量是多少，和之前查詢班級信息一樣，就不說了。

添加學生

  這一模塊中，我們要添加的信息包括姓名，密碼，性別，電話，QQ，班級。其中班級是在下拉列表中選擇。

$.ajax({
	type: "post",
  	url: "StudentServlet?method=AddStudent",
	data: $("#addForm").serialize(),
	success: function(msg){
		if(msg == "success"){
			.....
		}
});

  根據訪問請求的地址，查看具體是什麼信息、

	private void addStudent(HttpServletRequest req, HttpServletResponse res) {
		// TODO Auto-generated method stub
		String name = req.getParameter("name");
		String password = req.getParameter("password");
		String sex = req.getParameter("sex");
		String mobile = req.getParameter("mobile");
		String qq = req.getParameter("qq");
		int clazzId = Integer.parseInt(req.getParameter("clazzid"));
		Student student = new Student();
		student.setClazzId(clazzId);
		student.setMobile(mobile);
		student.setName(name);
		student.setPassword(password);
		student.setQq(qq);
		student.setSex(sex);
		student.setSn(SnGenerateUtil.generateSn(clazzId));
		StudentDao studentDao = new StudentDao();
		if(studentDao.addStudent(student)){
			try {
				res.getWriter().write("success");
			} catch (IOException e) {
				// TODO Auto-generated catch block
				e.printStackTrace();
			} finally {
				studentDao.closeCon();
			}
		}
	}

  其中可以看出，這裏做的操作是，獲取信息，保存信息，再到dao層去做更新。

	public boolean addStudent(Student student){
		String sql = "insert into s_student values(null,'"+student.getSn()+"','"+student.getName();
		sql += "','" + student.getPassword() + "','" + student.getClazzId();
		sql += "','" + student.getSex() + "','" + student.getMobile();
		sql += "','" + student.getQq()+ "',null)";
		return update(sql);
	}

  當執行成功後，就返回一個true，再向前臺傳回一個success。

圖片顯示

  爲了方便，我們在系統中另外設置一個servlet用於處理圖片。jsp中有這樣一行代碼

<img alt="照片" style="max-width: 200px; max-height: 400px;" title="照片" src="PhotoServlet?method=getPhoto" />

  那麼請求的地址也就十分顯而易見了

	private void getPhoto(HttpServletRequest req, HttpServletResponse res) {
		int id = req.getParameter("uid") == null ? 0 : Integer.parseInt(req.getParameter("uid"));
		if(id != 0){
			int userType = Integer.parseInt(req.getSession().getAttribute("userType").toString());
			if(userType == 2){
				// 學生
				StudentDao studentDao = new StudentDao();
				Student student = studentDao.getStudent(id);
				studentDao.closeCon();
				if(student != null){
					InputStream photo = student.getPhoto();
					if(photo != null){
						try {
							outputStream(new byte[photo.available()], res);
						} catch (IOException e) {
							// TODO Auto-generated catch block
							e.printStackTrace();
						}
					}
				}
			}else if(userType == 3){
				// 老師
				return;
			}
		}
		String path = req.getSession().getServletContext().getRealPath("");
		File file = new File(path+"\\file\\logo.jpg");
		try {
			FileInputStream fis = new FileInputStream(file);
			byte[] b = new byte[fis.available()];
			fis.read(b);
			res.getOutputStream().write(b,0,b.length);
			//	outputStream(new byte[fis.available()], res);
					
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
	}

  這個功能只是不想頁面空蕩蕩的。
  以上是獲取用戶的類型，如果是是學生的信息，就根據學生的id去查詢數據庫中的數據。如果數據庫中有圖片的數據，我們就將它返回給前臺顯示。如果沒有，我們就顯示一個本地的圖片到前臺去。其中包含的IO操作都是比較常規的寫法。

req.getSession().getServletContext().getRealPath("");

是獲取項目的路徑。

編輯學生信息

  在模板中有些信息我們是不需要的，所以前臺只保留一下幾項。

	<!-- 修改學生窗口 -->
	<div id="editDialog" style="padding: 10px">
		<div style="float: right; margin: 20px 20px 0 0; width: 200px; border: 1px solid #EBF3FF">
	    	<img id="edit_photo" alt="照片" style="max-width: 200px; max-height: 400px;" title="照片" src="" />
	    </div>   
    	<form id="editForm" method="post">
	    	<table cellpadding="8" >
	    		<tr>
	    			<td>姓名:</td>
	    			<td><input id="edit_name" style="width: 200px; height: 30px;" class="easyui-textbox" type="text" name="name" data-options="required:true, missingMessage:'請填寫姓名'" /></td>
	    		</tr>
	    		<tr>
	    			<td>性別:</td>
	    			<td><select id="edit_sex" class="easyui-combobox" data-options="editable: false, panelHeight: 50, width: 60, height: 30" name="sex"><option value="男">男</option><option value="女">女</option></select></td>
	    		</tr>
	    		<tr>
	    			<td>電話:</td>
	    			<td><input id="edit_mobile" style="width: 200px; height: 30px;" class="easyui-textbox" type="text" name="mobile" validType="mobile" /></td>
	    		</tr>
	    		<tr>
	    			<td>QQ:</td>
	    			<td><input id="edit_qq" style="width: 200px; height: 30px;" class="easyui-textbox" type="text" name="qq" validType="number" /></td>
	    		</tr>
	    		<tr>
	    			<td>班級:</td>
	    			<td><input id="edit_clazzList" style="width: 200px; height: 30px;" class="easyui-textbox" name="clazzid" /></td>
	    		</tr>
	    	</table>
	    </form>
	</div>

  Servlet中增加一個editStudent的方法，和之前編輯班級信息的代碼幾乎一致都是先獲取參數，保存到model對象中，再將屬性值傳給Dao。
  Dao中也增加一個editDtudent的方法，將傳入的參數嵌入sql語句中。

	public boolean editStudent(Student student) {
		String sql = "update s_student set name= '"+student.getName()+"'";
		sql += ",sex = '"+student.getSex() +"'";
		sql += ",mobile = '"+student.getMobile() +"'";
		sql += ",qq = '" +student.getQq() +"'";
		sql += ",clazz_id = '" +student.getClazzId()+"'";
		sql += " where id = '"+ student.getId() +"'";
		return update(sql);
	}

學生圖片上傳

<form id="uploadForm" method="post" enctype="multipart/form-data" action="PhotoServlet?method=SetPhoto" target="photo_target">
	    		<!-- StudentServlet?method=SetPhoto -->
		    	<input class="easyui-filebox" name="photo" data-options="prompt:'選擇照片'" style="width:200px;">
		    	<input id="uploadBtn" class="easyui-linkbutton" style="width: 50px; height: 24px;" type="button" value="上傳"/>
		    </form>
	<!-- 提交表單處理iframe框架 -->
	使用戶無感覺刷新
	<iframe id="photo_target" name="photo_target"></iframe>    

效果

新增一個點擊事件

		$("#uploadBtn").click(function(){
			$("#uploadForm").submit();
			setTimeout(function(){
				var message =  $(window.frames["photo_target"].document).find("#message").text();
				$.messager.alert("消息提醒",message,"info");
				
				$("#user_photo").attr("src", "PhotoServlet?method=GetPhoto&t="+new Date().getTime());
			}, 1500)
		});

photoServlet中寫一個方法uploadPhoto();