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的动画类 Fx.js
Nov 05 Javascript
jQuery获取选中内容及设置元素属性的方法
Jul 09 Javascript
详细解读JavaScript编程中的Promise使用
Jul 27 Javascript
jQuery点击按钮弹出遮罩层且内容居中特效
Dec 14 Javascript
AngularJS基础 ng-dblclick 指令用法
Aug 01 Javascript
js实现做通讯录的索引滑动显示效果和滑动显示锚点效果
Feb 18 Javascript
JSONP跨域请求
Mar 02 Javascript
vue 项目打包通过命令修改 vue-router 模式 修改 API 接口前缀
Jun 13 Javascript
Vue3.0结合bootstrap创建多页面应用
May 28 Javascript
vue(2.x,3.0)配置跨域代理
Nov 27 Javascript
javascript-hashchange事件和历史状态管理实例分析
Apr 18 Javascript
vue-router之解决addRoutes使用遇到的坑
Jul 19 Javascript
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
根德Grundig S400/S500/S700电路分析
2021/03/02 无线电
linux系统上支持php的 iconv()函数的方法
2011/10/01 PHP
php 修改、增加xml结点属性的实现代码
2013/10/22 PHP
PHP的拦截器实例分析
2014/11/03 PHP
利用PHP获取汉字首字母并且分组排序详解
2017/10/22 PHP
JavaScript 面向对象的之私有成员和公开成员
2010/05/04 Javascript
基于jquery的监控数据是否发生改变
2011/04/11 Javascript
基于javascript 闭包基础分享
2013/07/10 Javascript
Jquery树插件zTree用法入门教程
2015/02/17 Javascript
JS实现鼠标滑过折叠与展开菜单效果代码
2015/09/06 Javascript
jQuery采用连缀写法实现的折叠菜单效果
2015/09/18 Javascript
javascript针对cookie的基本操作实例详解
2015/11/30 Javascript
精通JavaScript的this关键字
2020/05/28 Javascript
微信小程序 Button 组件详解及简单实例
2017/01/10 Javascript
JavaScript数组迭代方法
2017/03/03 Javascript
判断jQuery是否加载完成,没完成继续判断的解决方法
2017/12/06 jQuery
详解Angular5路由传值方式及其相关问题
2018/04/28 Javascript
以v-model与promise两种方式实现vue弹窗组件
2018/05/21 Javascript
快速解决angularJS中用post方法时后台拿不到值的问题
2018/08/14 Javascript
[01:38]DOTA2第二届亚洲邀请赛中国区预选赛出线战队晋级之路
2017/01/17 DOTA
浅谈Python中的闭包
2015/07/08 Python
Python SQLite3简介
2018/02/22 Python
对python中矩阵相加函数sum()的使用详解
2019/01/28 Python
将python字符串转化成长表达式的函数eval实例
2020/05/11 Python
Django中使用Json返回数据的实现方法
2020/06/03 Python
Python坐标轴操作及设置代码实例
2020/06/04 Python
使用豆瓣源来安装python中的第三方库方法
2021/01/26 Python
基于CSS3特效之动画:animation的应用
2013/05/09 HTML / CSS
Html5 web本地存储实例详解
2016/07/28 HTML / CSS
约瑟夫·特纳男装:Joseph Turner
2017/10/10 全球购物
英国第一豪华护肤品牌:Elemis
2017/10/12 全球购物
SIDESTEP荷兰:在线购买鞋子
2019/11/18 全球购物
自我评价正确写法范文
2013/12/10 职场文书
学生周末长期请假条
2014/02/15 职场文书
违纪检讨书
2015/01/27 职场文书
大学军训口号大全
2015/12/24 职场文书