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 chosen动态设置值实例介绍
Aug 08 Javascript
Js实现手机发送验证码时按钮延迟操作
Jun 20 Javascript
jquery中EasyUI实现异步树
Mar 01 Javascript
jQuery 3.0十大新特性最终版发布
Jul 14 Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
Oct 14 Javascript
jquery select2的使用心得(推荐)
Dec 04 Javascript
详解微信小程序 页面跳转 传递参数
Dec 08 Javascript
JavaScript创建对象方式总结【工厂模式、构造函数模式、原型模式等】
Dec 19 Javascript
js尾调用优化的实现
May 23 Javascript
js回调函数原理与用法案例分析
Mar 04 Javascript
Vue props中Object和Array设置默认值操作
Jul 30 Javascript
浅析JavaScript中的事件委托机制跟深浅拷贝
Jan 20 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
《一拳超人》埼玉一拳下去,他们存在了800年毫无意义!
2020/03/02 日漫
PHP利用COM对象访问SQLServer、Access
2006/10/09 PHP
php 注册时输入信息验证器的实现详解
2013/07/05 PHP
基于preg_match_all采集后数据处理的一点心得笔记(编码转换和正则匹配)
2014/01/31 PHP
PHP中使用虚代理实现延迟加载技术
2014/11/05 PHP
PHP中常用的字符串格式化函数总结
2014/11/19 PHP
深入浅析PHP7.0新特征(五大新特征)
2015/10/29 PHP
php验证手机号码
2015/11/11 PHP
PHP将整数数字转换为罗马数字实例分享
2019/03/17 PHP
繁简字转换功能
2006/07/19 Javascript
js中的值类型和引用类型小结 文字说明与实例
2010/12/12 Javascript
使用jQuery中的when实现多个AJAX请求对应单个回调的例子分享
2014/04/23 Javascript
js数值计算时使用parseInt进行数据类型转换(jquery)
2014/10/07 Javascript
JQuery实现鼠标移动图片显示描述层的方法
2015/06/25 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
2016/06/30 Javascript
基于JavaScript实现屏幕滚动效果
2017/01/18 Javascript
详解VueRouter进阶之导航钩子和路由元信息
2017/09/13 Javascript
jQuery实现所有验证通过方可提交的表单验证
2017/11/21 jQuery
Vue中Quill富文本编辑器的使用教程
2018/09/21 Javascript
微信小程序实现张图片合成为一张并下载
2019/07/16 Javascript
如何管理Vue中的缓存页面
2021/02/06 Vue.js
Python命令行参数解析模块getopt使用实例
2015/04/13 Python
python统计文本文件内单词数量的方法
2015/05/30 Python
将字典转换为DataFrame并进行频次统计的方法
2018/04/08 Python
Python格式化输出字符串方法小结【%与format】
2018/10/29 Python
python循环定时中断执行某一段程序的实例
2019/06/29 Python
Python八皇后问题解答过程详解
2019/07/29 Python
python seaborn heatmap可视化相关性矩阵实例
2020/06/03 Python
Python基于Twilio及腾讯云实现国际国内短信接口
2020/06/18 Python
给领导的致歉信范文
2014/01/13 职场文书
教师师德师风个人整改方案
2014/09/18 职场文书
结婚老公保证书
2015/02/26 职场文书
小学中队长竞选稿
2015/11/20 职场文书
2016入党积极分子党课培训心得体会
2016/01/06 职场文书
实例讲解Python中sys.argv[]的用法
2021/06/03 Python
Spring Boot 底层原理基础深度解析
2022/04/03 Java/Android