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 stop()方法
Nov 21 Javascript
AngularJS中的Directive自定义一个表格
Jan 25 Javascript
jQuery Validation Plugin验证插件手动验证
Jan 26 Javascript
三个js循环的关键字示例(for与while)
Feb 16 Javascript
基于jQuery实现的无刷新表格分页实例
Feb 17 Javascript
jQuery数据检索中根据关键字快速定位GridView指定行的实现方法
Jun 08 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
Aug 26 Javascript
JS给swf传参数的实现方法
Sep 13 Javascript
Node.js自定义实现文件路由功能
Sep 22 Javascript
Vue 2.5 Level E 发布了: 新功能特性一览
Oct 24 Javascript
微信小程序中使用Async-await方法异步请求变为同步请求方法
Mar 28 Javascript
Vue项目中如何使用Axios封装http请求详解
Oct 23 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新手上路(二)
2006/10/09 PHP
真正根据utf8编码的规律来进行截取字符串的函数(utf8版sub_str )
2012/10/24 PHP
Apache中php.ini的设置方法
2013/02/28 PHP
PHP获取当前完整URL地址的函数
2014/12/21 PHP
php文件类型MIME对照表(比较全)
2016/10/07 PHP
提高网站性能之 如何对待JavaScript
2009/10/31 Javascript
传智播客学习之JavaScript基础篇
2009/11/13 Javascript
JavaScript函数详解
2014/11/17 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
2015/05/11 Javascript
JavaScript中constructor()方法的使用简介
2015/06/05 Javascript
json的使用小结
2016/06/08 Javascript
学习Javascript闭包(Closure)知识
2016/08/07 Javascript
AngularJs入门教程之环境搭建+创建应用示例
2016/11/01 Javascript
Bootstrap树形菜单插件TreeView.js使用方法详解
2016/11/01 Javascript
第一次接触神奇的前端框架vue.js
2016/12/01 Javascript
jQuery Ajax请求后台数据并在前台接收
2016/12/10 Javascript
Base64(二进制)图片编码解析及在各种浏览器的兼容性处理
2017/02/09 Javascript
js is_valid_filename验证文件名的函数
2017/07/19 Javascript
Node中使用ES6语法的基础教程
2018/01/05 Javascript
vue发送ajax请求详解
2018/10/09 Javascript
vue跳转页面的几种方法(推荐)
2020/03/26 Javascript
python中WSGI是什么,Python应用WSGI详解
2017/11/24 Python
selenium在执行phantomjs的API并获取执行结果的方法
2018/12/17 Python
python绘图模块matplotlib示例详解
2019/07/26 Python
Django实现基于类的分页功能
2019/10/31 Python
python的json中方法及jsonpath模块用法分析
2019/12/06 Python
小学教育毕业生自荐信
2013/11/18 职场文书
行政求职信
2014/07/04 职场文书
2014教师党员自我评议(5篇)
2014/09/20 职场文书
无房产证房屋转让协议书合同样本
2014/10/18 职场文书
三年级上册科学教学计划
2015/01/21 职场文书
优秀班主任工作总结2015
2015/05/25 职场文书
小学运动会报道稿
2015/07/22 职场文书
浅谈Java实现分布式事务的三种方案
2021/06/11 Java/Android
SQL模糊查询报:ORA-00909:参数个数无效问题的解决
2021/06/21 Oracle
Java日常练习题,每天进步一点点(38)
2021/07/26 Java/Android