Struts2+Jquery實現ajax並返回json類型資料__亂碼問題

 主要實現步驟如下：

1、JSP頁面使用指令碼代碼執行ajax請求

2、Action中查詢出需要返回的資料，並轉換為json類型模式資料

3、配置struts.xml檔案

4、頁面指令碼接受並處理資料

關鍵有如下幾個點

1.引入包：struts2對資料進行json序列化，必須要用到struts2的json-lib，struts2-json-plugin包；

2.json資料處理：非同步提交的資料採用json格式，struts2-json-plugin會對資料進行json處理，所以struts2設定檔struts.xml中的package節點的extends必須是：extends="json-default"；

例如：<package name="default" namespace="/test" extends="json-default">

3.同樣的由於返回的是json資料，所以result的類型也必須採用json；

注意：struts2隻能在引入json-lib，struts2-json-plugin包時，result的type屬性設定json才不會報錯：

<result type="json">
     <param name="root">result</param>
     <!-- result是action中設定的變數名，也是頁面需要返回的資料，該變數必須有setter和getter方法 -->
</result>

4.針對非同步提交，action的result節點值應該為空白，即不能再轉向(例如：只能為<result name="userInfo" type="json"></result>)；

1，首先看jsp頁面

頁面效果

做一個省市縣鄉村五級聯查的地區下拉式清單,首先進入頁面要載入所有省份頁面代碼：

$(function(){             var pid ="000000000000";     $.ajax({              url:"getRegionBranch.action",              type:"post",              data:"pid=" + pid,              dataType:"json",              success:function (data) {              $.each(data,function(i,item){                    $("#province").append("<option value=" + item.id + ">" + item.pcctvname + "</option>");//賦值                  });                },            error:function(xhr, status, error){ alert(status);                           alert(xhr.responseText); }//這裡不要加","          });     })

2， Action中查詢出需要返回的資料，並轉換為json類型模式資料,代碼如下

/** * 擷取地區 省市縣鄉鎮 五級資料 * @return * @throws Exception */public String getRegion() throws Exception{this.getRequestAndResponse();String pid =request.getParameter("pid");List<Region> region =branchService.getRegion(pid);regionList = JSONArray.fromObject(region);return SUCCESS;}

3，配置struts2.xml檔案

首先把

 <package name="struts1" extends="struts-default" namespace="/">  

改為

 <package name="struts1" extends="json-default,struts-default" namespace="/">  

這樣就可以返回json資料了。

        <!--支系管理   --><action name="*Branch" class="com.action.BranchAction"  method="{1}"><result type="json">     <param name="root">regionList</param></result>          <result name="list">/admin/branch/branch_list.jsp</result>        <result name="edit">/admin/branch/branch_edit.jsp</result></action>  

4，頁面接收處理資料

                $.each(data,function(i,item){             $("#province").append("<option value=" + item.id + ">" + item.pcctvname + "</option>");//賦值            });    

這裡是接收處理List類型轉化為json後的資料，迴圈處理賦值給select的下拉式清單。

還有一種返回一個Bean轉化為json的資料，例如：

 success:function (data) {    JSONObject json = JSONObject.fromObject(user);//將map對象轉換成json類型資料   result = json.toString();//給result賦值，傳遞給頁面}

result聲明get(),set()方法。

然後前台處理資料是這樣的：

   success:function(data){        var d = eval("("+data+")");//將資料轉換成json類型，可以把data用alert()輸出出來看看到底是什麼樣的結構        //得到的d是一個形如{"key":"value","key1":"value1"}的資料類型，然後取值出來        alert(d.name);        alert(d.age); }

注釋:只有返回字串時需要轉換為json對象時才會使用到eval()這個方法，如果ajax中已規定返回dataType為json，這裡就不需要使用這個方法了，可以直接使用返回的data資料，建議這樣使用。