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自定义DateDiff函数(兼容所有浏览器)
Mar 01 Javascript
JS中产生20位随机数以0-9为例也可以是a-z A-Z
Aug 01 Javascript
jQuery+html5+css3实现圆角无刷新表单带输入验证功能代码
Aug 21 Javascript
纯js实现手风琴效果代码
Apr 17 Javascript
Jquery on绑定的事件 触发多次实例代码
Dec 08 Javascript
如何提高javascript加载速度
Dec 26 Javascript
Vue如何引入远程JS文件
Apr 20 Javascript
vue组件学习教程
Sep 09 Javascript
vue cli 3.0 使用全过程解析
Jun 14 Javascript
Angular5.0 子组件通过service传递值给父组件的方法
Jul 13 Javascript
vue+element搭建后台小总结 el-dropdown下拉功能
Apr 10 Javascript
15 分钟掌握vue-next响应式原理
Oct 13 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
坏狼的PHP学习教程之第2天
2008/06/15 PHP
PHP curl_setopt()函数实例代码与参数分析
2011/06/02 PHP
深入php-fpm的两种进程管理模式详解
2013/06/03 PHP
php中用memcached实现页面防刷新功能
2014/08/19 PHP
php中get_object_vars()方法用法实例
2015/02/08 PHP
PHP实现合并discuz用户
2015/08/05 PHP
php实现异步数据调用的方法
2015/12/24 PHP
WordPress中登陆后关闭登陆页面及设置用户不可见栏目
2015/12/31 PHP
分享别人写的一个小型js框架
2007/08/13 Javascript
JavaScript 基础篇(一)
2012/03/30 Javascript
如何在JavaScript中实现私有属性的写类方式(一)
2013/12/04 Javascript
jQuery简单动画变换效果实例分析
2016/07/04 Javascript
Bootstrap实现可折叠分组侧边导航菜单
2018/03/07 Javascript
vue项目设置scrollTop不起作用(总结)
2018/12/21 Javascript
js实现简单音乐播放器
2020/06/30 Javascript
python创建关联数组(字典)的方法
2015/05/04 Python
在CentOS6上安装Python2.7的解决方法
2018/01/09 Python
Python中 传递值 和 传递引用 的区别解析
2018/02/22 Python
Python3.4学习笔记之 idle 清屏扩展插件用法分析
2019/03/01 Python
python的json中方法及jsonpath模块用法分析
2019/12/06 Python
Python 列表中的修改、添加和删除元素的实现
2020/06/11 Python
美国女性服饰销售网站:Nasty Gal(坏女孩)
2016/07/26 全球购物
VICHY薇姿英国官网:全球专业敏感肌护肤领先品牌
2017/07/04 全球购物
全球速卖通:AliExpress(国际版淘宝)
2017/09/20 全球购物
JPA的优势都有哪些
2013/07/04 面试题
大门门卫岗位职责
2013/11/30 职场文书
竞选演讲稿范文
2013/12/28 职场文书
2014年初一班主任工作总结
2014/11/08 职场文书
解放思想大讨论活动总结
2015/05/09 职场文书
债务追讨律师函
2015/06/24 职场文书
golang中的并发和并行
2021/05/08 Golang
Java基于字符界面的简易收银台
2021/06/26 Java/Android
MySQL数据库⾼可⽤HA实现小结
2022/01/22 MySQL
Vue3中toRef与toRefs的区别
2022/03/24 Vue.js
漫画《催眠麦克风-Dawn Of Divisions》第二卷PV公开
2022/04/05 日漫
python读取并查看npz/npy文件数据以及数据显示方法
2022/04/14 Python