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 相关文章推荐
基于Jquery的开发个代阴影的对话框效果代码
Jul 28 Javascript
js 获取和设置css3 属性值的实现方法
May 06 Javascript
jQuery源码解读之removeAttr()方法分析
Feb 20 Javascript
在Node.js应用中读写Redis数据库的简单方法
Jun 30 Javascript
BootStrap Table后台分页时前台删除最后一页所有数据refresh刷新后无数据问题
Dec 28 Javascript
JavaScript仿支付宝6位数字密码输入框
Dec 29 Javascript
原生js实现可拖拽效果
Feb 28 Javascript
Bootstrap Table 搜索框和查询功能
Nov 30 Javascript
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
Jan 17 Javascript
vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)
Jun 04 Javascript
jquery中attr、prop、data区别与用法分析
Sep 25 jQuery
ES6中Set和Map用法实例详解
Mar 02 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 $_SERVER当前完整url的写法
2009/11/12 PHP
php常用hash加密函数
2014/11/22 PHP
php支付宝系列之电脑网站支付
2018/05/30 PHP
laravel5.6框架操作数据curd写法(查询构建器)实例分析
2020/01/26 PHP
PHP7生产环境队列Beanstalkd用法详解
2020/05/19 PHP
JavaScript 事件冒泡简介及应用
2010/01/11 Javascript
jQuery中trigger()方法用法实例
2015/01/19 Javascript
JavaScript如何获取数组最大值和最小值
2015/11/18 Javascript
Angular和百度地图的结合实例代码
2016/10/19 Javascript
BootStrap 弹出层代码
2017/02/09 Javascript
详解nodejs微信公众号开发——1.接入微信公众号
2017/04/10 NodeJs
js统计页面上每个标签的数量实例代码
2018/05/29 Javascript
vue 中动态绑定class 和 style的方法代码详解
2018/06/01 Javascript
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
2018/06/14 jQuery
详解vue移动端项目代码拆分记录
2019/03/15 Javascript
python类和函数中使用静态变量的方法
2015/05/09 Python
python中__call__内置函数用法实例
2015/06/04 Python
python查找指定具有相同内容文件的方法
2015/06/28 Python
浅谈插入排序算法在Python程序中的实现及简单改进
2016/05/04 Python
Python IDLE清空窗口的实例
2018/06/25 Python
Python+Selenium使用Page Object实现页面自动化测试
2019/07/14 Python
django admin组件使用方法详解
2019/07/19 Python
python调用c++返回带成员指针的类指针实例
2019/12/12 Python
Python绘制数码晶体管日期
2021/02/19 Python
python 高阶函数简单介绍
2021/02/19 Python
html5+css3之制作header实例与更新
2020/12/21 HTML / CSS
ProBikeKit英国:在线公路自行车之家
2017/02/10 全球购物
Luxplus瑞典:香水和美容护理折扣
2018/01/28 全球购物
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
Bluebella法国官网:英国性感内衣品牌
2019/05/03 全球购物
解释一下ruby中的特殊方法与特殊类
2013/02/26 面试题
医科学校毕业生自荐信
2013/11/09 职场文书
初中生学习生活的自我评价
2013/11/20 职场文书
《陶罐和铁罐》教学反思
2014/02/19 职场文书
2014年结对帮扶工作总结
2014/12/17 职场文书
教师节祝酒词
2015/08/11 职场文书