spirngmvc js传递复杂json参数到controller的实例


Posted in Javascript onMarch 29, 2018

Spring MVC在接收集合请求参数时,需要在Controller方法的集合参数里前添加@RequestBody,而@RequestBody默认接收的enctype (MIME编码)是application/json,因此发送POST请求时需要设置请求报文头信息,否则Spring MVC在解析集合请求参数时不会自动的转换成JSON数据再解析成相应的集合。

以下列举接收List<String>、List<User>、List<Map<String,Object>>、User[]、User(bean里面包含List)几种较为复杂的集合参数示例:

接收List<String>集合参数:

1、页面js代码:

var idList = new Array(); 
idList.push(“1”); 
idList.push(“2”); 
idList.push(“3”); 
var isBatch = false; 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=deleteCatalogSchemes", 
 dataType: 'json', 
 data: {"idList":idList,"isBatch":isBatch}, 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

2、Controller方法:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=deleteCatalogSchemes") 
 @ResponseBody 
 public AjaxJson deleteCatalogSchemes(@RequestParam("idList[]") List<String> idList,Boolean isBatch) { 
   … 
 } 
}

接收List<User>、User[]集合参数:

1、User实体类:

public class User { 
  private String name; 
 private String pwd; 
 //省略getter/setter 
}

2、页面js代码:

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

3、Controller方法:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<User> userList) { 
  … 
 } 
}

如果想要接收User[]数组,只需要把saveUsers的参数类型改为@RequestBody User[] userArray就行了。

接收List<Map<String,Object>>集合参数:

1、页面js代码(不需要User对象了):

var userList = new Array(); 
userList.push({name: "李四",pwd: "123"}); 
userList.push({name: "张三",pwd: "332"}); 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(userList),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

2、Controller方法:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody List<Map<String,Object>> listMap) { 
  … 
 } 
}

接收User(bean里面包含List)集合参数:

1、User实体类:

public class User { 
 private String name; 
 private String pwd; 
 private List<User> customers;//属于用户的客户群 
 //省略getter/setter 
}

2、页面js代码:

var customerArray = new Array(); 
customerArray.push({name: "李四",pwd: "123"}); 
customerArray.push({name: "张三",pwd: "332"}); 
var user = {}; 
user.name = "李刚"; 
user.pwd = "888"; 
user. customers = customerArray; 
$.ajax({ 
 type: "POST", 
 url: "<%=path%>/catalog.do?fn=saveUsers", 
 data: JSON.stringify(user),//将对象序列化成JSON字符串 
 dataType:"json", 
 contentType : 'application/json;charset=utf-8', //设置请求头信息 
 success: function(data){ 
  … 
 }, 
 error: function(res){ 
  … 
 } 
});

3、Controller方法:

@Controller 
@RequestMapping("/catalog.do") 
public class CatalogController { 
 
 @RequestMapping(params = "fn=saveUsers") 
 @ResponseBody 
 public AjaxJson saveUsers(@RequestBody User user) { 
  List<User> customers = user.getCustomers(); 
  … 
 } 
}

以上这篇spirngmvc js传递复杂json参数到controller的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript replace()正则替换实现代码
Feb 26 Javascript
页面只有一个text的时候,回车自动submit的解决方法
Aug 12 Javascript
Jquery通过Ajax访问XML数据的小例子
Nov 18 Javascript
jquery select 设置默认选中的示例代码
Feb 07 Javascript
Jquery获取当前城市的天气信息
Aug 05 Javascript
Jquery循环截取字符串的方法(多出的字符串处理成&quot;...&quot;)
Nov 28 Javascript
利用jsonp与代理服务器方案解决跨域问题
Sep 14 Javascript
使用vue与jquery实时监听用户输入状态的操作代码
Sep 19 jQuery
解决layer图标icon不加载的问题
Sep 04 Javascript
VUE实现自身整体组件销毁的示例代码
Jan 13 Javascript
vue-router 2.0 跳转之router.push()用法说明
Aug 12 Javascript
vue3获取当前路由地址
Feb 18 Vue.js
Vue.js 表单控件操作小结
Mar 29 #Javascript
js传递数组参数到后台controller的方法
Mar 29 #Javascript
Vue.js实现可配置的登录表单代码详解
Mar 29 #Javascript
Vue项目中如何引入icon图标
Mar 28 #Javascript
JavaScript中的E-mail 地址格式验证
Mar 28 #Javascript
javascript性能优化之分时函数的介绍
Mar 28 #Javascript
Vue数据监听方法watch的使用
Mar 28 #Javascript
You might like
php获取指定范围内最接近数的方法
2015/06/02 PHP
Javascript 面向对象之重载
2010/05/04 Javascript
JavaScript 笔记二 Array和Date对象方法
2010/05/22 Javascript
漂亮的jquery提示效果(仿腾讯弹出层)
2013/02/05 Javascript
JavaScript中访问节点对象的方法有哪些如何使用
2013/09/24 Javascript
JS长整型精度问题实例分析
2015/01/13 Javascript
深入理解JavaScript系列(26):设计模式之构造函数模式详解
2015/03/03 Javascript
使用jQuery.form.js/springmvc框架实现文件上传功能
2016/05/12 Javascript
解决wx.onMenuShareTimeline出现的问题
2016/08/16 Javascript
利用transition实现文字上下抖动的效果
2017/01/21 Javascript
vue scroller返回页面记住滚动位置的实例代码
2018/01/29 Javascript
微信小程序自定义对话框弹出和隐藏动画
2018/07/19 Javascript
JavaScript 复制对象与Object.assign方法无法实现深复制
2018/11/02 Javascript
ES6入门教程之let、const的使用方法
2019/04/13 Javascript
javascript this指向相关问题及改变方法
2020/11/19 Javascript
用Python编写一个简单的Lisp解释器的教程
2015/04/03 Python
浅析Python 中整型对象存储的位置
2016/05/16 Python
python中的格式化输出用法总结
2016/07/28 Python
深入解答关于Python的11道基本面试题
2017/04/01 Python
Python找出微信上删除你好友的人脚本写法
2018/11/01 Python
python KNN算法实现鸢尾花数据集分类
2019/10/24 Python
Django对接支付宝实现支付宝充值金币功能示例
2019/12/17 Python
Python之变量类型和if判断方式
2020/05/05 Python
Python爬虫爬取百度搜索内容代码实例
2020/06/05 Python
Python 排序最长英文单词链(列表中前一个单词末字母是下一个单词的首字母)
2020/12/14 Python
浅析HTML5的WebSocket与服务器推送事件
2016/02/19 HTML / CSS
美国汽车交易网站:Edmunds
2016/08/17 全球购物
最耐用行李箱,一箱永流传:Briggs & Riley(全球终身保修)
2017/12/07 全球购物
蔻驰英国官网:COACH英国
2020/07/19 全球购物
函授药学自我鉴定
2014/02/07 职场文书
宿舍保安职务说明书
2014/02/25 职场文书
买房协议书范本
2014/10/23 职场文书
会议营销主持词
2015/07/03 职场文书
python opencv人脸识别考勤系统的完整源码
2021/04/26 Python
MySQL中优化SQL语句的方法(show status、explain分析服务器状态信息)
2022/04/09 MySQL
golang操作redis的客户端包有多个比如redigo、go-redis
2022/04/14 Golang