登入頁面的Controller的程式碼如下：

在這過程中，需要對填入資料進行判斷，是否為使用者名稱存在？是否密碼有誤？是否驗證碼有誤？如若都沒有錯誤則頁面跳轉至登入成功頁面。

@RequsetMapper("/login.do")
public @ResponseBody Map<String, Object> login(HttpServletRequest req,String validatecode,Model m,Userlist u){
	Map<String , Object> map =new HashMap<String,Object>();

	System.out.println(u.getUserAccount());
	Userlist us=userService.selectname(u.getUserAccount());//定義一個新的Userlist 並將資料庫查到的值賦予它
	//資料庫中沒有該使用者
	if(us == null){
		map.put("suc", false);
		map.put("error", "使用者名稱不存在！");
		return map;
	}

	String md5pwd=StringUtil.encode(u.getUserPassword());

	if(!md5pwd.equals(us.getUserPassword())){
		map.put("suc", false);
		map.put("error", "密碼錯誤！");
		return map;
		
	}
	String valiCode =(String)req.getSession().getAttribute("validateCode");   
	
	if(!validatecode.trim().equalsIgnoreCase(valiCode)){
		map.put("suc", false);
		map.put("error", "驗證碼錯誤！");
	    return map;
	}
	map.put("suc",true);//如果以上判斷都不是，則說明登入成功！跳轉成功頁面。   
	map.put("url","index.do");
	return map;
}
 

頁面AJAX的寫法

這裡需要注意的是JS,AJAX傳值問題.var userAccount=$("#userAccount").val(); 這種方法傳的是頁面資料，可直接與資料庫中資料進行比較。

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
		function test(){
		
			var userAccount=$("#userAccount").val();
			var userPassword=$("#userPassword").val();
			var validatecode=$("#validatecode").val();
			
			var flag=true;
	        //報紙名稱
	        if(userAccount=="") {
	          flag=false;
			  alert("使用者名稱不能為空！");
			  return;
	        }
	        if(userPassword=="") {
	          flag=false;
			  alert("密碼不能為空！");
			  return;
	        }
	        if(validatecode=="") {
	          flag=false;
			  alert("驗證碼不能為空！");
			  return;
	        }
	        $.ajax({
	        	url:'login.do',
	        	type:'post',
	        	data:'userAccount='+userAccount+'&userPassword='+userPassword+'&validatecode='+validatecode,
	        	datatype:'json',
	        	success: function(msg){
	        			if(msg.suc){
	        				location.href=msg.url;
	        			}else{
	        			   alert(msg.error);
	        			}
	        			
	        	}
	      
	        }) 
		}
		

 

頁面表單資料。

 <tr>
        <td width="31%" height="35" class="login-text02">使用者名稱稱：<br /></td>
        <td width="69%"><input id="userAccount" name="userAccount" type="text" size="30" /></td>
      </tr>
      <tr>
        <td height="35" class="login-text02">密　碼：<br /></td>
        <td><input id="userPassword" name="userPassword" type="password" size="33" /></td>
      </tr>
      <tr>
        <td height="35" class="login-text02">驗證圖片：<br /></td>
        <td><img id="imgcode" src="verifyCodeServlet?tm=<%=new Date() %>" width="109" height="40" /> <a href="javascript:void(0)" onclick="document.getElementById('imgcode').src='verifyCodeServlet?code='+Math.random();" class="login-text03">看不清楚，換張圖片</a></td>
      </tr>
      <tr>
        <td height="35" class="login-text02">請輸入驗證碼：</td>
        <td><input id="validatecode" name="validatecode" id="validatecode" type="text" size="30" /></td>
      </tr>
      <tr>
        <td height="35">&nbsp;</td>
        
        <td><input name="Submit" type="button" class="button" value="確認登陸"  onclick="test()"/>
  
      </tr>