最近在開發一個jsp學生信息管理系統,由於剛剛接觸jsp,遇到問題比較多,特此記錄與大家分享。 Jquery ajax提交表單到servlet示例 前臺部分代碼: ajax提交表單代碼: web.xml配置代碼: addStudents.java代碼(採用POST提交方式): ajax提交表單 通過 ...
最近在開發一個jsp學生信息管理系統,由於剛剛接觸jsp,遇到問題比較多,特此記錄與大家分享。
Jquery ajax提交表單到servlet示例
前臺部分代碼:
<form class="addSud" method="post" action="">
<table>
<tr>
<td class="textRight">姓名</td>
<td colspan="2"><input type="text" id="name" name="name"></td>
<td class="textRight">學號</td>
<td colspan="2"><input type="text" id="studentId" name="studentId"></td>
</tr>
<tr>
<td colspan="5"> <input type="submit" id="addStudents" value="提交"></td>
</tr>
</table>
</form>
ajax提交表單代碼:
//增加學生,非同步提交學生表單
$("#addStudents").click(function() {
$.ajax({
url: "addStudents.do",//要請求的伺服器url
//這是一個對象,表示請求的參數,兩個參數:method=ajax&val=xxx,伺服器可以通過request.getParameter()來獲取
//data:{method:"ajaxTest",val:value},
data: {
name: $("#name").val(),
studentId: $("#studentId").val(),
},
async: true, //是否為非同步請求
cache: false, //是否緩存結果
type: "POST", //請求方式為POST
dataType: "json", //伺服器返回的數據是什麼類型
success: function(result){ //這個方法會在伺服器執行成功是被調用 ,參數result就是伺服器返回的值(現在是json類型)
if(result){
alert("true");
}else{
alert("false");
}
}
});
});
web.xml配置代碼:
<servlet>
<description>This is the description of my J2EE component</description>
<display-name>This is the display name of my J2EE component</display-name>
<servlet-name>addStudents</servlet-name>
<servlet-class>org.cms.students.addStudents</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>addStudents</servlet-name>
<url-pattern>/addStudents.do</url-pattern>
</servlet-mapping>
addStudents.java代碼(採用POST提交方式):
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
PrintWriter out = response.getWriter();
String name=request.getParameter("name");
System.out.println(name);
System.out.println("123456789");
out.print("false");
}
ajax提交表單
通過上面的配置後,我輸入學生姓名然後提交表單,但是在myeclipse的控制台里並沒有列印出姓名和字元串“123456789”,然後我就開始了瘋狂的檢查,檢查了n遍,還是不知道錯誤出現在哪裡,一次偶然的機會我發現了問題所在。我在ajax代碼塊後加了個alert()語句,奇跡出現了,瀏覽器彈出相應內容,myeclipse的控制台里列印出姓名和字元串“123456789”,這讓我很是疑惑,在查閱大量博客和官方文檔後,我才明白一切都是JQuery ajax的同步和非同步提交的原因。
先來瞭解下JQuery ajax方法:
非同步的理解:當代碼執行到ajax部分時,它與ajax之後的外部代碼是一起執行的,假如此時有外部代碼要用到ajax中的返回值,而ajax的async屬性為true(即此時ajax為非同步),那麼後續的外部代碼是不可能能拿到ajax的返回值的,只有設置為同步即ajax的async屬性為true,執行完ajax部分時,再接著執行後續代碼時,才會在關係上產生連續性,則這樣才能拿到其返回值。
然後我就將async設置為false,問題真的解決了,但是還是不知道為什麼添加了alert語句即使是非同步也可以列印出姓名和字元串?
繼續查閱資料我自己的總結如下(歡迎各位大牛指點):
1、async:true時:當點擊提交按鈕時,執行點擊事件里的代碼語句,執行到ajax時,由於是非同步執行,所以並不會阻塞後面語句的執行,因為後面沒有語句了,所以可能由於ajax還沒來得及執行完點擊事件就結束了,自然就沒有列印出姓名和字元串。如果在ajax後添加alert語句,點擊事件就會被阻塞到這裡,這時ajax就有充足的時間執行,所以控制台就能列印出姓名和字元串。我嘗試去除外層的點擊事件,直接執行ajax,這時不論同步或者非同步都可以列印出姓名和字元串,可以證明我的猜想。
2、async:false時:當點擊提交按鈕時,也會執行點擊事件里的代碼語句,執行到ajax時,由於是同步執行,所以必須等ajax成功返回後才繼續執行後面的代碼,自然就能列印出姓名和字元串。
當然這些只是我個人的一些猜想,目前我還在查閱更多的資料來證明完善我的猜想,希望大牛們能指出我的錯誤,我一定虛心接受。