使用ajax将复选框的值提交到后台

说明

      在javaweb项目中,需要使用ajax将复选框的值的提交到后台,记录一下当时碰到的问题

正文

一、使用jQuery得到复选框的值

var checkID=[];
                $("input[name='checkbox']:checked").each(function(i){
                      checkID[i] = $(this).val();
                });

二、使用ajax异步提交

使用ajax将复选框的值提交到后台_第1张图片

注意图中红框的traditional选项

它的含义是是否使用传统的方式浅层序列化

默认为false,此时传到后台接收不到

使用ajax将复选框的值提交到后台_第2张图片

改为true后,后台可以正常接收到

这里写图片描述

三、完整代码

复选框

type="checkbox" value="${news.nid}" name="checkbox" id="checkbox">

脚本

<script type="text/javascript">
            function tijiao(){
                var checkID=[];
                $("input[name='checkbox']:checked").each(function(i){
                      checkID[i] = $(this).val();
                });

                $.ajax(
                    {data:{'checkID':checkID},
                      dataType:'text',
                      success: function(data){
                        alert(data);
                      },
                      type:'post',
                      url:'<%=basePath%>AddHotNewsSvl',
                      traditional:true
                    }
                );
            }

     script>

后台

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        String[]  checkID = request.getParameterValues("checkID");
        try {
            HotNewsIn.addHot(checkID);
        } catch (Exception e) {
            e.printStackTrace();
            Log.logger.error(e.getMessage());
        }
        response.setCharacterEncoding("utf-8");
        response.getWriter().write("设置成功");
    }

你可能感兴趣的:(javaweb)