• 135361

    文章

  • 827

    评论

  • 13

    友链

  • 最近新加了换肤功能,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

layui 批量删除和单个删除

2年想跳槽阿里,大咖揭秘大厂面试的那些事儿 >>

js

  layui.config({
        version: '1560414887155' //为了更新 js 缓存,可忽略
    });

    layui.use(['laydate', 'laypage',  'table',   'element'], function(){
        var laydate = layui.laydate //日期
            ,laypage = layui.laypage //分页
            ,table = layui.table //表格
            ,element = layui.element //元素操作

        //监听Tab切换
        element.on('tab(demo)', function(data){
            layer.tips('切换了 '+ data.index +':'+ this.innerHTML, this, {
                tips: 1
            });
        });

        //执行一个 table 实例
        table.render({
            elem: '#demo'
            ,height: 420
            ,url: '/getAllPageInfo' //数据接口
            ,title: '用户表'
            ,page: true //开启分页
            ,toolbar: 'default' //开启工具栏,此处显示默认图标,可以自定义模板,详见文档
            ,totalRow: true //开启合计行
            ,cols: [[ //表头
                {type: 'checkbox', fixed: 'left'}
                ,{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left', totalRowText: '合计:'}
                ,{field: 'fileCode', title: '文件编号', width:80}
                ,{field: 'timeOfReceipt', title: '收文时间', width: 90, sort: true}
                ,{field: 'deliveryUnit', title: '送文单位', width:80, sort: true}
                ,{field: 'categoryName', title: '类别', width: 80, sort: true}
                ,{field: 'fileTitle', title: '文件标题', width:150}
                ,{field: 'instructionsContent', title: '批示内容', width: 200}
                ,{field: 'processingInformation', title: '办理情况', width: 100}
                ,{field: 'suspicionsName', title: '县名称', width: 100}
                ,{field: 'remarks', title: '备注', width: 135, sort: true}
                ,{fixed: 'right', width: 165, align:'center', toolbar: '#barDemo'}
            ]]
            ,done: function () {
                $("[data-field='id']").css('display','none')
            }
        });

        //监听头工具栏事件
        table.on('toolbar(test)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id)
                ,data = checkStatus.data; //获取选中的数据


            switch(obj.event){
                case 'add':
                    layer.msg('添加');
                    break;
                case 'update':
                    if(data.length === 0){
                        layer.msg('请选择一行');
                    } else if(data.length > 1){
                        layer.msg('只能同时编辑一个');
                    } else {

                        var id=checkStatus.data[0].id;//id
                        var fileCode=checkStatus.data[0].fileCode;//文件编号
                        var timeOfReceipt=checkStatus.data[0].timeOfReceipt;//收文时间
                        var deliveryUnit=checkStatus.data[0].deliveryUnit;//送文单位
                        var categoryName=checkStatus.data[0].categoryName;//类别
                        var fileTitle=checkStatus.data[0].fileTitle;//文件标题
                        var instructionsContent=checkStatus.data[0].instructionsContent;//批示内容
                        var processingInformation=checkStatus.data[0].processingInformation;//办理情况
                        var suspicionsName=checkStatus.data[0].suspicionsName;//县名称
                        var remarks=checkStatus.data[0].remarks;//备注
                        //  layer.msg("修改");
                        layer.open({
                            title: '修改信息'
                            ,type: 1
                            ,closeBtn: false
                            ,area: '300px;'
                            ,shade: 0.8
                            ,id: 'LAY_layuipro'
                            ,btn: ['保存', '取消']
                            ,content: '<div>' +
                                '文件编号<input type="text" value="'+fileCode+'" id="fileCode"/></br>' +
                                '收文时间<input type="text" value="'+timeOfReceipt+'" id="timeOfReceipt"/></br>' +
                                '送文单位<input type="text" value="'+deliveryUnit+'" id="timeOfReceipt1"/></br>' +
                                '类别<input type="text" value="'+categoryName+'" id="categoryName"/></br>' +
                                '文件标题<input type="text" value="'+fileTitle+'" id="fileTitle"/></br>' +
                                '批示内容<input type="text" value="'+instructionsContent+'" id="instructionsContent"/></br>' +
                                '办理情况<input type="text" value="'+processingInformation+'" id="processingInformation"/></br>' +
                                '县<input type="text" value="'+suspicionsName+'" id="suspicionsName"/></br>' +
                                '备注<input type="text" value="'+remarks+'" id="remarks"/></br>' +
                                '</div>'
                            ,success: function(layero){
                                var btn = layero.find('.layui-layer-btn');
                                btn.find('.layui-layer-btn0').click(function () {
                                    var fileCode= top.$("#fileCode").val();
                                    var timeOfReceipt= top.$("#timeOfReceipt").val();
                                    var deliveryUnit= top.$("#timeOfReceipt1").val();
                                    var categoryName= top.$("#categoryName").val();
                                    var instructionsContent= top.$("#instructionsContent").val();
                                    var processingInformation= top.$("#processingInformation").val();
                                    var suspicionsName= top.$("#suspicionsName").val();
                                    var remarks= top.$("#remarks").val();
                                    var fileTitle= top.$("#fileTitle").val();

                                    $.ajax({
                                        //几个参数需要注意一下
                                        type: "post",//方法类型
                                        url: "/updateFile",//url
                                        data:{"id":id,"fileCode":fileCode
                                            ,"timeOfReceipt":timeOfReceipt,"deliveryUnit":deliveryUnit
                                            ,"categoryName":categoryName,"instructionsContent":instructionsContent
                                            ,"processingInformation":processingInformation,"suspicionsName":suspicionsName
                                            ,"remarks":remarks,"fileTitle":fileTitle},
                                        dataType:"json",
                                        async:false,
                                        success: function (result) {
                                            console.log(result);//打印服务端返回的数据(调试用)
                                            if (0==result ) {
                                                alert("修改失败");

                                            }else{

                                                window.location.replace("intoHead");
                                            };
                                        },
                                        error : function() {
                                            alert("请稍后重试!");
                                        }
                                    })
                                })

                            }
                        });
                    }
                    break;
                case 'delete':


                    var ids=[];
                    for (var i=0;i<data.length;i++){

                        ids.push(checkStatus.data[i].id)
                    }

                    if(data.length === 0){
                        layer.msg('请选择一行');
                    } else {
                      
                        layer.open({
                            title: '删除信息'
                            ,type: 1
                            ,closeBtn: false
                            ,area: '300px;'
                            ,shade: 0.8
                            ,id: 'LAY_layuipro'
                            ,btn: ['保存', '取消']
                            ,content: '是否删除'
                            ,success: function(layero){
                                var btn = layero.find('.layui-layer-btn');
                                btn.find('.layui-layer-btn0').click(function () {
                                    $.ajax({
                                        //几个参数需要注意一下
                                        type: "post",//方法类型
                                        url: "/deleteFile",//url
                                        data:{"id":ids},
                                        dataType:"json",
                                        async:false,
                                        traditional: true,
                                        success: function (result) {
                                            console.log(result);//打印服务端返回的数据(调试用)
                                            if (0==result ) {
                                                alert("修改失败");

                                            }else{
                                                window.location.replace("intoHead");
                                            };
                                        },
                                        error : function() {
                                            alert("请稍后重试!");
                                        }
                                    })
                                })

                            }
                        });

                    }
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(test)', function(obj){ //注:tool 是工具条事件名,test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                ,layEvent = obj.event; //获得 lay-event 对应的值
            if(layEvent === 'detail'){
                //layer.msg('查看操作');
                //获取值
                var id=data.id;
                var fileCode=data.fileCode;//文件编号
                var timeOfReceipt=data.timeOfReceipt;//收文时间
                var deliveryUnit=data.deliveryUnit;//送文单位
                var categoryName=data.categoryName;//类别
                var fileTitle=data.fileTitle;//文件标题
                var instructionsContent=data.instructionsContent;//批示内容
                var processingInformation=data.processingInformation;//办理情况
                var suspicionsName=data.suspicionsName;//县名称
                var remarks=data.remarks;//备注
                //弹出层
                layer.open({
                    title: '查看详细信息'
                    ,content: '<div>' +
                        '<div>文件编号: '+fileCode+'</div>' +
                        '<div>收文时间: '+timeOfReceipt+'</div>' +
                        '<div>送文单位: '+deliveryUnit+'</div>' +
                        '<div>类别: '+categoryName+'</div>' +
                        '<div>文件标题: '+fileTitle+'</div>' +
                        '<div>批示内容: '+instructionsContent+'</div>' +
                        '<div>办理情况: '+processingInformation+'</div>' +
                        '<div>县名称: '+suspicionsName+'</div>' +
                        '<div>备注: '+remarks+'</div>' +
                        '</div>'
                });
            } else if(layEvent === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del(); //删除对应行(tr)的DOM结构
                    layer.close(index);
                    //向服务端发送删除指令
                    $.ajax({
                        //几个参数需要注意一下
                        type: "post",//方法类型
                        url: "/deleteFile",//url
                        data:{"id":data.id},
                        dataType:"json",
                        async:false,
                        success: function (result) {
                            console.log(result);//打印服务端返回的数据(调试用)
                            if (0==result ) {
                                alert("删除失败");

                            }else{
                                window.location.replace("intoHead");
                            };
                        },
                        error : function() {
                            alert("请稍后重试!");
                        }
                    })
                });
            } else if(layEvent === 'edit'){
                var id=data.id;//id
                var fileCode=data.fileCode;//文件编号
                var timeOfReceipt=data.timeOfReceipt;//收文时间
                var deliveryUnit=data.deliveryUnit;//送文单位
                var categoryName=data.categoryName;//类别
                var fileTitle=data.fileTitle;//文件标题
                var instructionsContent=data.instructionsContent;//批示内容
                var processingInformation=data.processingInformation;//办理情况
                var suspicionsName=data.suspicionsName;//县名称
                var remarks=data.remarks;//备注
              //  layer.msg("修改");
                layer.open({
                    title: '修改信息'
                    ,type: 1
                    ,closeBtn: false
                    ,area: '300px;'
                    ,shade: 0.8
                    ,id: 'LAY_layuipro'
                    ,btn: ['保存', '取消']
                    ,content: '<div>' +
                        '文件编号<input type="text" value="'+fileCode+'" id="fileCode"/></br>' +
                        '收文时间<input type="text" value="'+timeOfReceipt+'"  id="timeOfReceipt"/></br>' +
                        '送文单位<input type="text" value="'+deliveryUnit+'" id="timeOfReceipt1"/></br>' +
                        '类别<input type="text" value="'+categoryName+'" id="categoryName"/></br>' +
                        '文件标题<input type="text" value="'+fileTitle+'" id="fileTitle"/></br>' +
                        '批示内容<input type="text" value="'+instructionsContent+'" id="instructionsContent"/></br>' +
                        '办理情况<input type="text" value="'+processingInformation+'" id="processingInformation"/></br>' +
                        '县<input type="text" value="'+suspicionsName+'" id="suspicionsName"/></br>' +
                        '备注<input type="text" value="'+remarks+'" id="remarks"/></br>' +
                        '</div>'
                    ,success: function(layero){
                        var btn = layero.find('.layui-layer-btn');
                        btn.find('.layui-layer-btn0').click(function () {
                            var fileCode= top.$("#fileCode").val();
                            var timeOfReceipt= top.$("#timeOfReceipt").val();
                            var deliveryUnit= top.$("#timeOfReceipt1").val();
                            var categoryName= top.$("#categoryName").val();
                            var instructionsContent= top.$("#instructionsContent").val();
                            var processingInformation= top.$("#processingInformation").val();
                            var suspicionsName= top.$("#suspicionsName").val();
                            var remarks= top.$("#remarks").val();
                            var fileTitle= top.$("#fileTitle").val();

                                $.ajax({
                                    //几个参数需要注意一下
                                    type: "post",//方法类型
                                    url: "/updateFile",//url
                                    data:{"id":id,"fileCode":fileCode
                                        ,"timeOfReceipt":timeOfReceipt,"deliveryUnit":deliveryUnit
                                        ,"categoryName":categoryName,"instructionsContent":instructionsContent
                                        ,"processingInformation":processingInformation,"suspicionsName":suspicionsName
                                        ,"remarks":remarks,"fileTitle":fileTitle},
                                    dataType:"json",
                                    async:false,
                                    success: function (result) {
                                        console.log(result);//打印服务端返回的数据(调试用)
                                        if (0==result ) {
                                            alert("修改失败");

                                        }else{

                                            window.location.replace("intoHead");
                                        };
                                    },
                                    error : function() {
                                        alert("请稍后重试!");
                                    }
                                })
                        })

                    }
                });
            }
        });

        //分页
        laypage.render({
            elem: 'pageDemo' //分页容器的id
            ,count: 100 //总页数
            ,skin: '#1E9FFF' //自定义选中色值
            //,skip: true //开启跳页
            ,jump: function(obj, first){
                if(!first){
                    layer.msg('第'+ obj.curr +'页', {offset: 'b'});
                }
            }
        });



        slider.render({
            elem: '#sliderDemo'
            ,input: true //输入框
        });

        //底部信息
        var footerTpl = lay('#footer')[0].innerHTML;
        lay('#footer').html(layui.laytpl(footerTpl).render({}))
            .removeClass('layui-hide');
    });

controller

/**
     * 通过id删除
     * @param id
     * @return
     */
    @PostMapping("deleteFile")
    public int deleteFile(Integer[] id){
        return operationService.deleteFileById(id);
    }

 


695856371Web网页设计师②群 | 喜欢本站的朋友可以收藏本站,或者加入我们大家一起来交流技术!

0条评论

Loading...


发表评论

电子邮件地址不会被公开。 必填项已用*标注

自定义皮肤 主体内容背景
打开支付宝扫码付款购买视频教程
遇到问题联系客服QQ:419400980
注册梁钟霖个人博客