JQuery中Ajax實現對Map,List集合資料的接收
阿新 • • 發佈：2019-01-28
jQuery中Ajax接收後臺Map、List集合資料實現過程
最近學習到jQuery實現非同步傳輸資料部分，雖然跟著視訊演練了常規json資料的接收，但個人感覺不太夠，現實應用中肯定不只是傳輸簡短以及簡單的json資料，於是自己琢磨著嘗試從後臺接收List、Map資料，在搜尋工具的幫助以及自身的理解下，成功完成了接收過程。廢話不多說，以程式碼來展示過程：
* 前端jsp登入端程式碼+js程式碼
//body部分
<body>
<div id="loginDemo">
使用者名稱:<input type="text" id="username" 前端部分程式碼比較簡單，就是一個登陸框，以json資料格式的方式提交給後臺，請求成功時，輸出傳回的實體物件型資料，List集合型資料，以及關鍵的Map型集合資料
struts.xml核心部分程式碼
<package name="default" namespace="/" extends="json-default">
<action name="login" class="com.cn.action.UserAction" method="login">
<result type="json">
<param name="includeProperties">
user.*,users.*,msg,m.*
</param>
</result>
</action>
</package>
//注意一定要繼承json-default，且要提前引入相關的jar包，對於程式碼裡面各引數的作用以及用法就不作過多贅述了
action中核心程式碼
public class UserAction extends ActionSupport {
private User user;
private List<User> users;
private Map<String,User> m ;
private String msg;
public String login(){
if("admin".equals(user.getUsername())&&"111111".equals(user.getPassword())){
user = new User("admin","111111");
//建立集合物件
users = new ArrayList<User>();
users.add(new User("Linda","memeda"));
users.add(new User("Mary","lalala"));
users.add(user);
//建立map物件
m = new HashMap<String,User>();
m.put("user1", new User("XiaoJing","yuyuyu"));
m.put("user2", new User("KangGe","kangying"));
msg = "登陸成功！";
}else{
msg = "登入失敗3";
}
return SUCCESS;
}
//後續對成員屬性的setter和getter方法沒有列出，沒有列出並不代表不重要，如果沒有設定setter和getter方法是無法獲取到前臺發過來的資料的。列出此過程幾個比較重要的核心知識點
- 前臺Ajax的格式書寫，包括髮送給後臺的json資料，以及對後臺傳回資料的接收，注意map、list以及實體物件型資料的接收方式。對於陣列型別的資料還存在遍歷的問題，過程並不複雜，故此處並未列出
- struts.xml的配置。在struts.xml中，必須繼承json-default，而繼承此package又需要相關的jar包支援，因此必須在專案開始前引入徐昂管的jar包。struts.xml中還應注意< result >中type屬性應為json，預設的是dispatcher，進行json資料傳輸時一定得改為json。最後就是< param >的includeProperties屬性。此處是設定傳回前臺的資料型別。哪些可以傳回去，哪些不行，都可以在此處進行設定，類似於過濾的作用
- action的編寫，一定要繼承自actionSupport(實現action介面也可以，不過相對要麻煩一些)。然後就是為相關屬性設定setter和getter方法，這一步是必須的，不然接收不到前臺傳來的資料。最後就是在指定的方法中進行相關的業務處理，過程並不複雜。
- 外加一個剛遇到的一個問題。當從後臺返回的資料僅有一個字串時，若想從前臺取出該字串，直接呼叫data即可，不用寫成”data.XXX”的形式。寫了反而會報undefined的錯誤。謹記謹記