[jsp小技巧]利用Throw Exception來完成Ajax

一般在寫Ajax時,最直覺的使用方法就是利用Ajax Object來要求Server給與回應,

再依回應的內容解西倒底是完成動作?還是有錯誤產生,如必填欄位未填。

這裡介紹一個小技巧,在編譯式的網頁伺服器語言可能比較合適使用。

大概的原理是利用程式在執行有錯誤時Throw Exception來當做錯誤訊息,

回傳給client,而client只要接收到503的錯誤,則就可以知道動作並未完成,

反之則是完成。

範例使用prototype來使用Ajax,傳送及回應,有需要可以參考:

Ajax 使用prototype.js 1

以下是載行結果,當有填值時,則回應填寫的值,

沒填值的時候就回傳錯誤訊息。(Exception)

1

2




1需要建立一個class extends Exception

裡面需實作String getMessage(),這是要給ErrorPage取得值使用的

package myexception;

public class AjaxException extends Exception {
  private String message ;
  public AjaxException(String message)
  {
    this.message = message;
  }
  public String getMessage()
  {
    return this.message;
  }
}

2建立一個ErrorPage,當有錯誤時利用這個網頁來顯示資料Error.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" isErrorPage="true"%><%=exception.getMessage()%>

3建立主程式,執行Ajax要求並處理回傳   -MyAjax.jsp

其中onFailure 處理503,也就是錯誤回傳

onSuccess 處理200,也就是執行完成

 

<%@ 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">
<title>Insert title here</title>
<script type="text/javascript" src="js/prototype-1.6.0.3.js">
</script>
</head>
<body style="background-color:#ff0f01">
<script type="text/javascript">
function myclick(){
//prototype的Ajax class
new Ajax.Request("TestAjax.jsp",{method:'post',
  postBody:'id='+$F("myid"),
  onCreate:function (transport)
 
    //建立Ajax時要啟動的function 
  },
  onSuccess: function(transport)
  {//成功執行的話
    alert("成功:"+transport.responseText);
  
  },onFailure:function(transport)
  {//有出錯誤的話
    alert("有錯誤產生:"+transport.responseText);
  }
  });
}
</script>

<input type="text" id="myid" name="myid" />
<input type="button" value="取得答案" onclick="myclick();" />
</body>
</html>

4建立Ajax要求的伺服器回應頁,記得要指定errorPage     -TestAjax.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" errorPage="Error.jsp"%><%
    String id = request.getParameter("id");
    if(id==null || id.trim().length()==0)//沒傳值進來的話
      throw new myexception.AjaxException("沒有傳送參數");
    else
      out.println(id);
    %>

發表迴響

你的電子郵件位址並不會被公開。 必要欄位標記為 *

*