SpringMVC 接收多个checkbox提交参数的问题

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/zero_295813128/article/details/52794258

springMVC在接收多个checkbox提交表单参数的时候的问题!!!!!!

当前端表单序列化为json对象提交checkbox数据的时候有个这样的问题,


如图我有3个checkbox的数据,checkbox的name为position,当值勾选一个的时候springMVC接收参数的时候的name为position,当提交一个以上的时候接收前端的参数需要时数组,这时候需要在springMVC的方法上使用如下代码

@RequestMapping("/add.html")
    @ResponseBody
    public ResultModel add(HttpServletRequest request, @RequestParam(value = "position[]", required = false) String[] positions) {
        Map map = getParamMap(request);
        map.put("positions", positions);
        return boardService.addBoardCategory(map);
    }
这时候就有一个问题checkbox勾选一个的时候接收name是position,一个以上的时候是position[],这样后端岂不是要多做一个次判断,这样很是麻烦,所以很想解决这个问题,这时候就需要把前端的checkbox的name进行一些改动,改动如下

<span class="pc">
      <input type="checkbox" name="position[]" value="1"/>流行经典
      <input type="checkbox" name="position[]" value="2"/>有好货趣创意
      <input type="checkbox" name="position[]" value="3"/>代购首页好店驾到
</span>
<span style="display: none" class="app">
      <input type="checkbox" name="position[]" value="4"/>代购首页
      <input type="checkbox" name="position[]" value="5"/>有好货首页
</span>
这样修改的name名字以后提交单个参数接收的时候也能通过position[] 来接收这样后端就不用做多余判断了。

下面附上前端代码

 $("#addOrUpdateBt").click(function () {
        var categoryName = $("#boardCategoryForm #categoryName").val();
        if ($.trim(categoryName).length == 0) {
            alert("请填写主标题");
            return;
        }
        var listImgHref = $("#boardCategoryForm #listImgHref").val();
        if ($.trim(listImgHref).length == 0) {
            alert("请上传列表主图");
            return;
        }

        var id = $("#boardCategoryForm #id").val();
        var url = "";
        if ($.trim(id).length != 0) {
            url = "${ctx}/admin/boardCategory/operation/update.html";
        } else {
            url = "${ctx}/admin/boardCategory/operation/add.html";
        }

        $.ajax({
            type: "post",
            url: url,
            data: $("#boardCategoryForm").serializeObject(),
            dataType: "json",
            success: function (result) {
                if (result.state == 0) {
                    $("#boardCategoryDiv").modal("hide");
                    $("#boardCategoryTable").bootstrapTable("refresh");
                } else {
                    alert(result.msg);
                }
            }
        });
    });

前端表单是通过serializeObject来提交参数

在springMVC接收数组参数的时候还出现了点问题,报了400错误,google了下springMVC接收数组的相关示例,结合一些文档解决了问题。在没有勾选checkbox提交参数的时候,将springMVC接收参数的地方required改成了false,解决了出现400的问题,下面是google出来的springMVC的示例

-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

如果 JQuery 要往服务端传递一个数组参数,请求的方式如下

$.ajax({
    url : ${yourURL},
    data: {yourParam:[1,2,3,4]},
    success:function(data){
    }
});

或者:

$.ajax({
    url : ${yourURL},
    data: {"yourParam[]":[1,2,3,4]},
    success:function(data){
    }
});

前端传递参数这两种写法都可以,建议写成第二种,而服务端的接收参数对应起来。

那么在服务端的 Controller怎么接收这个参数?

@RequestMapping"/save")
public void save(@RequestParam(value="yourParam[]" String[] yourParam){
    // do Something...
}

注意: @RequestParam 一定要用数组的形式 “yourParam[]” 作为接收参数, 这样的话才能够正确的接收到前端传递的数组, 如果前端的数组为空,接收到的也是空串。 比如:前端传递的参数: data:{"yourParam[]":[null,null,null]} 那么服务端接收到的参数将会是 [“”,””,””] 无需担心空指针问题。

如果不用 “yourParam[]” 作为接收参数的话,将会发生莫名的错误。

猜你喜欢

转载自blog.csdn.net/zero_295813128/article/details/52794258
今日推荐