zoukankan      html  css  js  c++  java
  • 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");
                        }
                    });
                }
            }
        }
  • 相关阅读:
    动态规划解按摩师的最长预约时间
    C#中WinForm的Tab键顺序调整顺序
    内网穿透工具对比FRP+NPS+Zerotier与NAT服务器测试
    " " 和 ' ' 混用拼接html字符串,且含有事件,事件中有参数
    HAProxy在Windows下实现负载均衡与反向代理
    react 导入src外部的文件 Relative imports outside of src/ are not supported.
    11_实例
    C#删除指定目录下文件(保留指定几天前的日志文件)
    【转】系统创建定时执行任务bat批处理删除指定N天前文件夹的文件
    mariadb导如数据异常------Error Code: 1153
  • 原文地址:https://www.cnblogs.com/zhaojiayu/p/15746697.html
Copyright © 2011-2022 走看看