ajax提交form表單到servlet,網頁的跳轉
jsp介面如下:
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="css/styleA.css" id="sc1"/>
<link rel="stylesheet" type="text/css" href="css/index1.css" id="sc2"/>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery.json-2.4.js"></script>
<title>Insert title here</title>
<style>
body{background:#D0D0D0;}
</style>
<title>Insert title here</title>
<% //同樣實現取消客戶端快取
response.setHeader("Pragma","No-cache");
response.setHeader("Cache-Control","no-cache");
response.setDateHeader("Expires", 0);
String name="loginCode";
%>
<script>
$(function(){
$("#button").click(function(){
var dldata="";
dldata={"username":$("#username").val(),"password":$("#password").val(),"role":$("#role").val(),"code":$("#code").val()};
var data=JSON.stringify(dldata);
alert(data);
$.ajax({
type:"POST",
contentType:"application/json",
url:"LoginServlet",
data:data,
dataType:"json",
success:function(data){
// $('#new_book').clearForm(); //清空表單
if(data.Status=="1"){
alert("登入成功!");
window.location.href="StudentRegister.jsp";
}
},
error:function(e){
alert("登入失敗");
}
});
});
});
/* --------登入註冊結束-------- */
</script>
<script type="text/javascript">
/*-------------登陸驗證是否有空值---------*/
function myCheck()
{
for(var i=0;i<document.denglu.elements.length-1;i++)
{
if(document.denglu.elements[i].value=="")
{
alert("當前目錄不能有空項");
document.form1.elements[i].focus();
return false;
}
}
return true;
}
/*-------------登陸驗證是否有空值結束---------*/
</script>
<script type="text/javascript">
function loadimage(){
document.getElementById("randImage").src = "image.jsp?"+Math.random();
}
</script>
</head>
<body>
<div class="login-container" style="margin-top:150px;" align="center">
<h1 style="color:#F0F0F0;">歡迎登入</h1>
<div style="margin-top:40px;">
<form action="#" method="post" id="loginForm">
<div>
學號<input type="text" id="username" name="username" class="text" />
</div>
<div style="margin-top:20px;">
密碼<input type="password" id="password" name="password" class="password" />
</div>
<div style="margin-top:10px;">
驗證碼<input type="text" id="code" size="4">
<img onclick="javascript:loadimage();" name="randImage" id="randImage" src="image.jsp"/>
</div>
</form>
<div style="margin-top:20px;">
身份;<select id="role">
<option value="student" >學生</option>
<option value="teacher" >教師</option>
<option value="manger" >管理員</option>
</select>
</div>
</div>
<div style="margin-top:20px;">
<input type="button" id ="button"value="登入" style="width:50px;height:28px;" class="button" onclick="validate();" />
</div>
<div style="margin-top:20px;">
<a href="#" class="hvr-sweep-to-right">忘記密碼?</a><br>
<a href="StudentRegister.jsp" class="hvr-sweep-to-right">點此進行學生註冊</a><br>
<a href="TeacherRegister.jsp" class="hvr-sweep-to-right">點此進行教師註冊</a>
</div>
</div>
</body>
</html>
servlet如下:
package b505.zlc.homework.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.mail.Session;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import net.sf.json.JSONObject;
import b505.zlc.homework.bean.Manger;
import b505.zlc.homework.bean.Students;
import b505.zlc.homework.bean.Teachers;
import b505.zlc.homework.daoimpl.MangerDaoImpl;
import b505.zlc.homework.daoimpl.StudentsDaoImpl;
import b505.zlc.homework.daoimpl.TeacherDaoImpl;
import b505.zlc.homework.tools.ReadJSON;
public class LoginServlet extends HttpServlet {
/**
*
*/
private static final long serialVersionUID = 1L;
/**
* 控制使用者的登入
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("執行了嗎");
request.setCharacterEncoding("UTF-8");
response.setContentType("text/html; charset=utf-8");
response.setCharacterEncoding("UTF-8");
@SuppressWarnings("unused")
PrintWriter out=response.getWriter();
//bl用於boolean方法的
boolean bl=false;
StudentsDaoImpl sdi=new StudentsDaoImpl();
TeacherDaoImpl tdi=new TeacherDaoImpl();
MangerDaoImpl mdi=new MangerDaoImpl();
Students st=new Students();
Teachers tr=new Teachers();
Manger mr=new Manger();
ReadJSON rj=new ReadJSON();
String dataString=rj.readJSONString(request);
System.out.println("dataString---->"+dataString);
JSONObject jsonObject=new JSONObject();
JSONObject json=JSONObject.fromObject(dataString);
//System.out.println("dataString---->"+dataString);
String role=json.getString("role");
System.out.println("role--->"+role);
String u=json.getString("username");
String p=json.getString("password");
String code=json.getString("code");
String codeString=(String)request.getSession().getAttribute("sRand");
System.out.println(code);
System.out.println(codeString);
if(role.equals("student")){
bl=sdi.check(u, p);
if(bl){
st.student(u, p);
request.getSession().setAttribute("studentinformation",st );
System.out.println("使用者合法,可以登入");
jsonObject.put("Status", "1");
out.print(jsonObject.toString());
//System.out.println(jsonObject.toString());
//request.getRequestDispatcher("index.jsp").forward(request, response);
}else{
jsonObject.put("Status", "0");
out.print(jsonObject.toString());
//request.getRequestDispatcher("Login.jsp").forward(request, response);
}
}
if(role.equals("teacher")){
bl=sdi.check(u, p);
if(bl){
tr.teacher(u, p);
request.getSession().setAttribute("teahcerInfor", tr);
request.getRequestDispatcher("").forward(request, response);
}else{
request.getRequestDispatcher("Login.jsp").forward(request, response);
}
}
if(role.equals("manger")){
if(mdi.check(u, p)){
request.getRequestDispatcher("").forward(request, response);
}else{
request.getRequestDispatcher("Login.jsp").forward(request, response);
}
}
}
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
}
第一次接觸ajax(我還是個新手)以為在servlet中用request就能開啟實現頁面的跳轉,自己研究了半天都沒成功,後得高人相助,原來就是用request請求,會與前天產生衝突,所以沒有成功。自己水平低,第一次寫部落格,如有不妥,還望賜教!