用jquer ajax获取多选框的值传到后台实现删除功能

最新推荐文章于 2021-08-06 13:35:42 发布

卢本伟

最新推荐文章于 2021-08-06 13:35:42 发布

阅读量1.1k

点赞数 1

文章标签： ajax 获取多选框 jquery 分割字符串多选删除

本文链接：https://blog.csdn.net/qq_39514287/article/details/78049801

版权

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" isELIgnored="false"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <base href="<%=basePath%>">

    <title>My JSP 'fs.jsp' starting page</title>

    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script type="text/javascript" src="js\jquery-2.1.0.js">
    </script>
    <script type="text/javascript">
        $(function () {

            $(".allhousename").click(function () {

                var a=$(this).attr("i");
                location.href="CityController/findById.action?id="+a;
                alert(a);


            })
            $("#todel").click(function () {
                var arr=[];
                var arr2=$(":checked");
                $.each(arr2,function () {
                    arr.push($(this).val());
                })
                alert(arr)
         $.ajax({
                    url : "CityController/delCity.action",
                    type : "GET",
                    data : {"id" : arr.join(",")
                    },
                    dataType : "text",
                    success : function(data){
                        alert(data);
                        if(data=="ok"){

                            alert("删除成功")
                            location.href="CityController/findAll.action";
                        }
                        else{
                            alert("删除失败");
                        }

                    },
                    error : function(){
                        alert("至少选择一个");
                    }
                });



            })
        })

        function mm(o) {
            var a = document.getElementsByName("id");
            for (var i=0;i<a.length;i++){
                a[i].checked = o.checked;
            }
        }


    </script>

</head>

<body>
查询所有页面
<center>
    <form action="/CityController/findAllByNumAndName.action">
        房产编号：<input name="cityNo">
        房产名称： <input name="cityName">
        <input value="保存" type="submit">
    </form>
    <table>

        <tr>
            <td><input type="checkbox" id="out"  οnclick=mm(this) value="0"></td>
            <td>序号</td>
            <td>房产编号</td><td>房产名称</td>
        </tr>

        <c:forEach items="${all}" var="all" varStatus="a">

            <tr>

                <td><input type="checkbox" value="${all.id}" name="id" class="ids"></td>
                <td>${a.index+1} </td>
                <td>${all.cityNo}</td>
                <td class="allhousename" i="${all.id}">${all.cityName}</td>
            </tr>
        </c:forEach>




    </table>
    <input value="删除" type="button" id="todel">
</center>

</body>
</html>

Controller层：

@RequestMapping(value="delCity")
@ResponseBody
public String delCity(String id){
    System.out.println("进来了");
    String[] split = id.split(",");//因为传过来的ids以（1，2，3...）这种形式 所以要分割
    for (String s:split
            ) {
        int i =Integer.parseInt(s);
        cityService.delCity(i);//每次都走这个方法
    }
    System.out.println("走完了");
    return "ok";


}