js传递json参数到controller步骤详解

这次给大家带来js传递json参数到controller步骤详解,js传递json参数到controller的注意事项有哪些,下面就是实战案例,一起来看一下。

Spring MVC在接收集合请求参数时,需要在Controller方法的集合参数里前添加@RequestBody,而@RequestBody默认接收的enctype (MIME编码)是application/json,因此发送POST请求时需要设置请求报文头信息,否则Spring MVC在解析集合请求参数时不会自动的转换成JSON数据再解析成相应的集合。

以下列举接收List、List、List

>、User[]、User(bean里面包含List)几种较为复杂的集合参数示例:

接收List集合参数:

1、页面js代码:

var idList = new Array(); idList.push(“1”); idList.push(“2”); idList.push(“3”); var isBatch = false; $.ajax({  type: "POST",  url: "/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 idList,Boolean isBatch) {    …  } }

登录后复制

接收List、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: "/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 userList) {   …  } }

登录后复制

如果想要接收User[]数组,只需要把saveUsers的参数类型改为@RequestBody User[] userArray就行了。

接收List

>集合参数:

1、页面js代码(不需要User对象了):

var userList = new Array(); userList.push({name: "李四",pwd: "123"}); userList.push({name: "张三",pwd: "332"}); $.ajax({  type: "POST",  url: "/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> listMap) {   …  } }

登录后复制

接收User(bean里面包含List)集合参数:

1、User实体类:

public class User {  private String name;  private String pwd;  private List 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: "/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 customers = user.getCustomers();   …  } }

登录后复制

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

Vue把html字符串转化为HTML步骤详解

vue根据环境传递参数打包不同域名方法详解

以上就是js传递json参数到controller步骤详解的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2763889.html

(0)
上一篇 2025年3月8日 10:21:20
下一篇 2025年3月8日 10:21:27

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • JS获取url参数并发送Json格式POST请求案例详解

    这次给大家带来JS获取url参数并发送Json格式POST请求案例详解,JS获取url参数并发送Json格式POST请求的注意事项有哪些,下面就是实战案例,一起来看一下。 登录后复制 一、获取url所有参数值 function US() {…

    编程技术 2025年3月8日
    000
  • Vue.js实现可配置登录表单步骤详解

    这次给大家带来Vue.js实现可配置登录表单步骤详解,Vue.js实现可配置登录表单的注意事项有哪些,下面就是实战案例,一起来看一下。 业务场景 在之前,项目只支持手机号+密码登录,前端是直接把表单写死的,后来有客户希望能支持验证码登录,有…

    2025年3月8日
    200
  • 怎样用JS验证E-mail格式

    这次给大家带来怎样用JS验证E-mail格式,用JS验证E-mail格式的注意事项有哪些,下面就是实战案例,一起来看一下。 最近做了一个前端的项目,要求:输入的数据必须包含 @ 符号和点号(.)。同时,@ 不可以是邮件地址的首字符,并且 @…

    2025年3月8日
    200
  • JS如何优化分时函数

    这次给大家带来JS如何优化分时函数,JS优化分时函数的注意事项有哪些,下面就是实战案例,一起来看一下。 函数节流的原理是:延迟当前函数的执行,如果该次延迟还没有完成,那么忽略接下来该函数的请求。也就是说会忽略掉很多函数请求。 在一些开发场景…

    编程技术 2025年3月8日
    200
  • JS实现左右列表互相调换功能

    这次给大家带来JS实现左右列表互相调换功能,JS实现左右列表互相调换的注意事项有哪些,下面就是实战案例,一起来看一下。 实现功能: 1.左边的下拉框内容添加到右边的下拉框,支持多选移动,且同时将右边的下拉框对象移除; 2.支持列表中项目上下…

    2025年3月8日
    200
  • js获取ModelAndView需要哪些步骤

    这次给大家带来js获取ModelAndView需要哪些步骤,js获取ModelAndView的注意事项有哪些,下面就是实战案例,一起来看一下。 1 方法一 【有效】 可以的,跟el表达式访问方式一样。 示例代码,一个数据展示请求的Actio…

    编程技术 2025年3月8日
    200
  • jQuery+ajax读取json并排序方法详解

    这次给大家带来jQuery+ajax读取json并排序方法详解,jQuery+ajax读取json并排序的注意事项有哪些,下面就是实战案例,一起来看一下。 $.ajax({ url: ‘data.json’,//获取本地json数据,在同文…

    编程技术 2025年3月8日
    200
  • Angularjs实现控制器通信步骤详解

    这次给大家带来Angularjs实现控制器通信步骤详解,Angularjs实现控制器通信的注意事项有哪些,下面就是实战案例,一起来看一下。 利用angularjs开发项目中,控制器之间的通信,比如参数的传递,数据的传递,都是比较常见的。控制…

    编程技术 2025年3月8日
    200
  • js对数值数组进行去重与优化

    这次给大家带来js对数值数组进行去重与优化,js对数值数组进行去重与优化的注意事项有哪些,下面就是实战案例,一起来看一下。 前言 本文主要介绍了关于js构建二叉树进行数值数组的去重与优化的相关内容,分享出来供大家参考学习,下面话不多说了,来…

    编程技术 2025年3月8日
    200
  • JS实现红黑树步骤详解

    这次给大家带来JS实现红黑树步骤详解,JS实现红黑树的注意事项有哪些,下面就是实战案例,一起来看一下。 红黑树的性质 一棵满足以下性质的二叉搜索树是一棵红黑树 每个结点或是黑色或是红色。 根结点是黑色的。 每个叶结点(NIL)是黑色的。 如…

    2025年3月8日 编程技术
    200

发表回复

登录后才能评论