spring mvc接收list的方法(转载)

最新推荐文章于 2021-08-14 10:02:33 发布

村口老槐树

最新推荐文章于 2021-08-14 10:02:33 发布

阅读量402

点赞数

分类专栏： Spring MVC

Spring MVC 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

实现方式一

前端页面

<%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <html>
 5 <head>
 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 7 <title>测试</title>
 8 </head>
 9 <body>
10     <input type="button" name="request" value="请求后台" style="width:200px;height:50px;background-color:red;margin-bottom:20px;">
11     <div name="rs"></div>
12     <input type="checkbox" name="se" value="1">hafiz.zhang<br/>
13     <input type="checkbox" name="se" value="2">jack.chen<br/>
14     <input type="checkbox" name="se" value="3">lili.wang<br/>
15 <script type="text/javascript">
16 
17     $("input[name='request']").click(function(){
18         var data = [];
19         $("input[name='se']").each(function(){
20             if($(this).prop("checked")) {
21                 data.push($(this).val());
22             }
23         });
24         var json_data = JSON.stringify(data);
25         $.ajax({
26             type:"post",
27             url:$.wap.url + "/test/index",
28             contentType:"application/json",
29             data:json_data ,
30             dataType:"json",
31             success:function(data){
32                 var str="";
33                 for(var i = 0; i < data.length; i++) {
34                     str += ";name=" + data[i];
35                 }
36                 $("div[name='rs']").html(str);
37             },
38             error:function(){
39                 alert("出错啦");
40             }
41         });
42     });    
43 </script>
44 </body>
45 </html>

后台接收


@Controller
@RequestMapping("/test")
public class TestController {
     @RequestMapping(value = "/index", method = RequestMethod.POST)
     @ResponseBody
     public List<Integer> test(@RequestBody ArrayList<Integer> ids){
         System.out.println("List==" + ids);
         return ids;
     }
 }

注意：这种方法只适用于POST方法提交，(上面代码中标红的是必不可少的代码)如果使用get方法会出现如下图所示的错误

这是因为get方式的参数中的双引号会被编码，导致传到后台的不再是json串格式，所以解析出错。

实现方式二

前端页面

 <%@ page language="java" contentType="text/html; charset=UTF-8"
 2     pageEncoding="UTF-8"%>
 3 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 4 <html>
 5 <head>
 6 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 7 <title>测试</title>
 8 </head>
 9 <body>
10     <input type="button" name="request" value="请求后台" style="width:200px;height:50px;background-color:red;margin-bottom:20px;">
11     <div name="rs"></div>
12     <input type="checkbox" name="se" value="1">hafiz.zhang<br/>
13     <input type="checkbox" name="se" value="2">jack.chen<br/>
14     <input type="checkbox" name="se" value="3">lili.wang<br/>
15 <script type="text/javascript">
16 
17     $("input[name='request']").click(function(){
18         var data = [];
19         $("input[name='se']").each(function(){
20             if($(this).prop("checked")) {
21                 data.push($(this).val());
22             }
23         });
24         $.ajax({
25             type:"get",
26             url:$.wap.url + "/test/index",
27             data:{"datas":data},//或者data:{"datas[]":data}
28             dataType:"json",
29             success:function(data){
30                 var str="";
31                 for(var i = 0; i < data.length; i++) {
32                     str += ";name=" + data[i];
33                 }
34                 $("div[name='rs']").html(str);
35             },
36             error:function(){
37                 alert("出错啦");
38             }
39         });
40     });    
41 </script>
42 </body>
43 </html>

后台接收，指定参数名必须以数组方式，如：@RequestParam("datas[]")

　1).通过ArrayList接收

@Controller
@RequestMapping("/test")
public class TestController {
    @RequestMapping(value = "/index", method = RequestMethod.POST)
    @ResponseBody
    public Integer[] test(@RequestParam("datas[]") Integer[] ids){
        System.out.println("ids==" + ids);
        return ids;
    }
}

注意：

　　1.这种方式对于get和post方式的请求同样都适用....

　　2.以上两种实现方式传到后台的数据不能为null,否则会报Http 400错误。

实现方式三

　前端页面

1 <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
 2 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 3 <html>
 4 <head>
 5     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 6     <title>测试</title>
 7 </head>
 8 <body>
 9 <input type="button" name="request" value="请求后台"
10        style="width:200px;height:50px;background-color:red;margin-bottom:20px;">
11 <div name="rs"></div>
12 <input type="checkbox" name="se" value="1">hafiz.zhang<br/>
13 <input type="checkbox" name="se" value="2">jack.chen<br/>
14 <input type="checkbox" name="se" value="3">lili.wang<br/>
15 <script type="application/javascript" src="js/jquery-1.11.1.min.js"></script>
16 <script type="text/javascript">
17 
18     $("input[name='request']").click(function () {
19         var data = [];
20         $("input[name='se']").each(function () {
21             if ($(this).prop("checked")) {
22                 data.push($(this).val());
23             }
24         });
25         $.ajax({
26             type: "post",
27             url: "/test/index",
28             data: {"datas": data.join()}
29             dataType: "json",
30             success: function (data) {
31                 var str = "";
32                 for (var i = 0; i < data.length; i++) {
33                     str += ";name=" + data[i];
34                 }
35                 $("div[name='rs']").html(str);
36             },
37             error: function () {
38                 alert("出错啦");
39             }
40         });
41     });
42 </script>
43 </body>
44 </html>

后端代码

　　1)通过数组接收

@Controller
@RequestMapping("/test")
public class TestController {
    @RequestMapping(value = "/index", method = RequestMethod.POST)
    @ResponseBody
    public List test(@RequestParam("datas") List<Integer> ids) {
        System.out.println("ids=" + ids);
        return ids;
    }
}

这种方式即使没有选中任何复选框进行提交，也不会报错！

对于想要前端传自定义对象数组到后端，以上的方式就不适用了，那么解决办法是什么呢？

ajax请求中设置contentType:"application/json;charset=utf-8"
ajax请求中设置data:JSON.stringify(dataList)
后端Controller种用@RequestBody YourObject[] data进行接收，并且只能用数组接收.

如果你有更好的实现方式，希望可以拿来分享。。。。

三、总结

1.实现方式一只对post方法有效，且比较繁琐，不推荐！

2.实现方式二要求后端接收的时候必须声明参数为数组，但可以使用数组或者list进行接收参数，如：@RequestParam("datas[]")，前端使用data:{"datas":data}或data:{"datas[]":data}都可以！且post和get方法都适用。但是不能传空数组,限制也比较多，也不太推荐。

3.实现方式三只需要前端传值的时候使用数组的join()方法，为空数组也不会报错，配置简单，要求少，且支持使用数组和list进行接收参数，比较推荐！

转载自: https://www.cnblogs.com/hafiz/p/5498936.html

村口老槐树

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
spring mvc接收list的方法(转载)

实现方式一前端页面&lt;%@ page language="java" contentType="text/html; charset=UTF-8" 2 pageEncoding="UTF-8"%&gt; 3 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.o
复制链接

扫一扫

专栏目录