牛骨文教育服务平台(让学习变的简单)
博文笔记

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

创建时间:2017-11-01 投稿人: 浏览次数:1369

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

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

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

二、使用ajax异步提交

这里写图片描述

注意图中红框的traditional选项

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

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

这里写图片描述

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

这里写图片描述

三、完整代码

复选框

<input 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("设置成功");
    }
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。