prototype Ajax回傳json物件的處理

一般人在設計ajax成功回傳事件時,有幾種方式來處理回傳的資料,一種是純文字或html code,一種是xml格式那另一種就是json格式,json格式不像xml需要成對的tag,所以在回傳資料長度上會顯的短很快,如果整個網站都大量使用ajax方法的話,選擇json是一個很好的方法。

ajaxjson2.png

json的相關資訊可以在這裡看到:JSON in JavaScript

prototype這個framework本身就有支援To JSON的方法,有二種格式可以轉換成json,一種是javascript的class,另一種就是純文字了,不過純文字的內容要為json格式才能被轉換,如下:




所以在設計ajax response文字時,就特意的輸出成json格式的內容,再利用prototype轉成json物件,那就可以在javascript裡直接使用了。

以下用一個簡單的例子來說明,form request ajax要求一個查詢,查詢經由一個jsp做處理,處理好後輸出json格式回傳給剛才的request,接收到response後,轉換成javascript的json物件,再取出物件內容來顯示在畫面上。

底下是prototype Ajax的寫法,直接用form上的設定當成request,然後再處理responseText就可以了。

再來是jsp內容,jsp裡直接使用JSON in Java 的class來建立就可以了

結果大概會如下的畫面:

ajaxjson1.png

原始檔如下:

發表迴響

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

*