• 60.商品项目(批量删除)


    1.页面开发

    全选钮功能

    <script type="text/javascript">
        //全选复选框功能实现
        function allClick() {
            //获得当前点击后全选按钮的状态
            var flag = $("#all").prop("checked");
            //将此状态赋值给下面五个复选框
            $("input[name='ck']").each(function () {
                this.checked = flag;
            });
        }
    
        //单个复选框点击改变全选复选框功能实现
        function ckClick() {
            //得到下面五个复选框的个数
            var fiveLength = $("input[name='ck']").length;
            //得到下面五个复选框被选中的个数
            var checkedLength = $("input[name='ck']:checked").length;
            //进行对比,改变全选复选框的状态
            if(fiveLength == checkedLength){
                $("#all").prop("checked",true);
            }else{
                $("#all").prop("checked",false);
            }
        }
    </script>

    2.mapper层实现

    将被选中的商品的pid拼接成字符串,比如"1,4,5"上传到服务器端

    <delete id="deleteBatch" >
        delete from product_info where p_id  in
        <foreach collection="array" item="pid" separator="," open="(" close=")">
            #{pid}
        </foreach>
      </delete>

    3.service层实现

    @Override
        public int deleteBatch(String[] ids) {
            return productInfoMapper.deleteBatch(ids);
        }

    4.controller开发

    //批量删除商品
        @RequestMapping("/deleteBatch")
        //pids="1,4,5"  ps[1,4,5]
        public String deleteBatch(String pids,HttpServletRequest request){
            //将上传上来的字符串截开,形成商品id的字符数组
            String []ps = pids.split(",");
    
            try {
                int num = productInfoService.deleteBatch(ps);
                if(num > 0 ){
                    request.setAttribute("msg","批量删除成功!");
                }else{
                    request.setAttribute("msg","批量删除失败!");
                }
            } catch (Exception e) {
                request.setAttribute("msg","商品不可删除!");
            }
            return "forward:/prod/deleteAjaxSplit.action";
        }
    }

    批量删除结束后应该跳到deleteAjaxSplit分页上,再回到当前页面上

    deleteAjaxSplit控制器那里必须有@ResponseBody表明ajax在这里进行返回

    5.ajax批量删除页面判断提示

     //批量删除
        function deleteBatch() {
            //得到所有选中复选框的对象,根据其长度判断是否有选中商品
            var cks = $("input[name='ck']:checked");  //1,4,5
            //如果有选中的商品
            if(cks.length == 0){
                alert("请先选择将要删除的商品!");
            }else{
                var str = "";
                var pid = "";
                if(confirm("您确定要删除"+cks.length+"条商品吗?")){
                   // alert("可以进行删除!");
                    //获取其value的值,进行字符串拼接
                    $.each(cks,function () {
                        pid = $(this).val();
                        //进行非空判断,避免出错
                        if(pid != null){
                            str += pid+",";  //145   ===>1,4,5,
                        }
                    });
    
                    //发送ajax请求,进行批量删除的提交
                    $.ajax({
                        url:"${pageContext.request.contextPath}/prod/deleteBatch.action",
                        data:{"pids":str},
                        type:"post",
                        dataType:"text",
                        success:function (msg) {
                            alert(msg);//批量删除成功!失败!不可删除!
                            //将页面上显示商品数据的容器重新加载
                            $("#table").load("http://localhost:8080/admin/product.jsp #table");
                        }
                    });
                }
            }
        }
  • 相关阅读:
    JVM内存分析 规格严格
    比MyBatis快了100倍 规格严格
    jstatd运行,远端监控 规格严格
    浅谈Linux下查看某一进程占用的内存 规格严格
    如何查看jvm堆外内存使用情况? 规格严格
    nginx location中uri的截取的实现方法 规格严格
    date获取毫秒和秒 规格严格
    DAX 第四篇:行上下文
    钓鱼邮件
    Htmx 使html 也可以发送请求
  • 原文地址:https://www.cnblogs.com/zhaojiayu/p/15746697.html
Copyright © 2020-2023  润新知