ajax傳遞list集合


原文鏈接:https://blog.csdn.net/qq_37936542/article/details/79277495

一:ajax傳遞List<String>類型的數據

js代碼:

[html] view plain copy
  1. //聲明list  
  2. var _list = [];  
  3. //放入string對象  
  4. for (var i = 0; i < 3; i++) {  
  5.     _list[i]="tom";  
  6. }  
  7.   
  8. $.ajax({  
  9.     url : '/ajax/test',  
  10.     data : "list="+_list,  
  11.     type : "POST",  
  12.     success : function(data) {  
  13.         alert(data);  
  14.     }  
  15. });  

java代碼:
[html] view plain copy
  1. @RequestMapping(value="test",method=RequestMethod.POST)  
  2. @ResponseBody  
  3. public String ajaxList(@RequestParam("list")List<String> strList){  
  4.           
  5.     for (String str : strList) {  
  6.         System.out.println(str);  
  7.     }  
  8.     return "OK";  
  9. }  


二:ajax傳遞List<Obj>類型的數據

后台需要用到json解析工具,我選得是jackson

導入jackson依賴:

[html] view plain copy
  1. <dependency>  
  2.     <groupId>com.fasterxml.jackson.core</groupId>  
  3.     <artifactId>jackson-databind</artifactId>  
  4.     <version>2.7.3</version>  
  5. </dependency>  

js代碼:
[html] view plain copy
  1. //聲明list  
  2. var _list = [];  
  3. //創建兩個user對象  
  4. var a= {};  
  5. a.name="tom";  
  6. a.age=23;  
  7. a.city="上海";  
  8. var b = {};  
  9. b.name="jack";  
  10. b.age=25;  
  11. a.city="安徽";  
  12. //將user放入_list  
  13. _list.push(a);  
  14. _list.push(b);  
  15.   
  16. $.ajax({  
  17.     url : '/ajax/test1',  
  18.     data : "list="+JSON.stringify(_list),  
  19.     type : "POST",  
  20.     success : function(data) {  
  21.         alert(data);  
  22.     }  
  23. });  


java代碼:
[html] view plain copy
  1. @RequestMapping(value="test",method=RequestMethod.POST)  
  2. @ResponseBody  
  3. public String ajaxList(@RequestParam("list")String userList) throws Exception{  
  4.     //jackson對象  
  5.     ObjectMapper mapper = new ObjectMapper();  
  6.     //使用jackson將json轉為List<User>  
  7.     JavaType jt = mapper.getTypeFactory().constructParametricType(ArrayList.class, User.class);     
  8.     List<User> list =  (List<User>)mapper.readValue(userList, jt);  
  9.           
  10.     return "OK";  
  11. }  


三:當ajax傳遞任何復雜參數時,后台可以直接從流中來讀取數據進行解析

js代碼:

[html] view plain copy
  1. //聲明list  
  2. var _list = [];  
  3. //創建兩個user對象  
  4. var a= {};  
  5. a.name="tom";  
  6. a.age=23;  
  7. a.city="上海";  
  8. var b = {};  
  9. b.name="jack";  
  10. b.age=25;  
  11. a.city="安徽";  
  12. //將user放入_list  
  13. _list.push(a);  
  14. _list.push(b);  
  15.   
  16. $.ajax({  
  17.     url : '/querz/test',  
  18.     data : JSON.stringify(_list),//這里需要json化  
  19.     type : "POST",  
  20.     success : function(data) {  
  21.         alert(data);  
  22.     }  
  23. });  

java代碼:
[html] view plain copy
  1. @RequestMapping(value="test",method=RequestMethod.POST)  
  2. @ResponseBody  
  3. public String ajaxList(HttpServletRequest request) throws Exception{  
  4.       
  5.     //從流中讀取數據  
  6.     BufferedReader br = request.getReader();  
  7.     String str = "";  
  8.     StringBuffer sb = new StringBuffer();  
  9.     while((str = br.readLine()) != null){  
  10.         sb.append(str);  
  11.     }  
  12.           
  13.     ObjectMapper mapper = new ObjectMapper();  
  14.     //使用jackson解析數據  
  15.     JavaType jt = mapper.getTypeFactory().constructParametricType(ArrayList.class, User.class);     
  16.     List<User> list =  (List<User>)mapper.readValue(sb.toString(), jt);   
  17.     System.out.println(list);  
  18.           
  19.     return "OK";  

文末福利:

福利一:前端,Java,產品經理,微信小程序,Python等10G資源合集大放送:https://www.jianshu.com/p/e8197d4d9880

福利二:微信小程序入門與實戰全套詳細視頻教程

【領取方法】

關注 【編程微刊】微信公眾號:

回復【小程序demo】一鍵領取130個微信小程序源碼demo資源。

回復【領取資源】一鍵領取前端,Java,產品經理,微信小程序,Python等資源合集10G資源大放送。


image

90后前端妹子,愛編程,愛運營,愛折騰。
堅持總結工作中遇到的技術問題,堅持記錄工作中所所思所見,歡迎大家一起探討交流。



免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM