zoukankan      html  css  js  c++  java
  • Layui批量删除

    监听复选框 监听点击事件

    • 两个按钮放在<script>中
    <script type="text/html" id="toolbarDemo">
      <div class="layui-btn-container demoTable">
        <button class="layui-btn layui-btn-sm" lay-event="add" ><i class="layui-icon layui-icon-add-circle-fine" style="font-size:20px;font-weight:bold"></i> 新增班级</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchdel" data-type="getCheckData"><i class="layui-icon layui-icon-delete" style="font-size:20px;"></i> 批量删除</button>
      </div>
    </script>

    在生成表格的js中 使用了toolbar:"#toolbarDemo",使按钮加载到表格上

    • JS实现批量删除(首先开启复选框监听,接着监听点击,active中获取选中数据,通过遍历数据,将班级id存储在delList数组中,通过var strify = JSON.stringify(delList);将数组转为JSON字符串)
    //批量删除
         active = {
                    getCheckData: function(){ //获取选中数据
                        var checkStatus = table.checkStatus('tableAll')
                        ,checkData = checkStatus.data,
                        delList=[];
                         
                         for (var i = 0; i < checkData.length; i++) {
                            delList.push(checkData[i].classid);
                         }
                         var strify = JSON.stringify(delList);
                        console.log(strify);
                        $.ajax({
                            url:"../../ClassesDeleteBatchServlet",
                            dataType:'json',
                            data:{
                                datas:strify
                            },
                            type:'post',
                            success:function(data){
                                if (data == 0) {
                                    layer.msg('删除失败!',{icon:5,offset:"auto",time:2000});//提示框
                                }else{
                                    layer.msg('删除成功!',{icon:6,offset:"auto",time:2000});//提示框
                                }
                                
                                setTimeout(function(){
                                    location.reload();//重新加载页面表格
                                }, 2100);
                            }
                        })
                    }    
                 };
            //监听点击
           $('.demoTable .layui-btn').on('click', function(){
                 var type = $(this).data('type');
                 active[type] ? active[type].call(this) : '';
             });
          //监听表格复选框选择
              table.on('checkbox(table1)', function(obj){
                  console.log(obj);
              })

    转载:https://blog.csdn.net/qq_41154522/article/details/99683490

    -------------------------------------------------------------自己项目--------------------------------------------------------------------------

    <script type="text/html" id="toolbarDemo">
      <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
        <button class="layui-btn layui-btn-sm layui-btn-danger" lay-event="batchdel" data-type="getCheckData"><i class="layui-icon layui-icon-delete" style="font-size:20px;"></i> 批量删除</button>
      </div>
    </script>
    //头工具栏事件
    table.on('toolbar(test)', function(obj){

    var checkStatus = table.checkStatus(obj.config.id);
    switch(obj.event){
    case 'getCheckData':
    var data = checkStatus.data;
    layer.alert(JSON.stringify(data));
    break;
    case 'getCheckLength':
    var data = checkStatus.data;
    layer.msg('选中了:'+ data.length + ' 个');
    break;
    case 'isAll':
    layer.msg(checkStatus.isAll ? '全选': '未全选');
    break;
    //全部删除
    case 'batchdel':

    checkData = checkStatus.data;
    delList=[];

    for (var i = 0; i < checkData.length; i++) {
    delList.push(checkData[i].id);
    }

    if(delList == ''){
    layer.alert('请选择删除项');return;
    }

    layer.confirm('确定批量删除吗?', function(index){
    layer.close(index);
    $.ajax({
    type:'post',
    dataType:'json',
    url:"{:url('comment/send_comment_del_many')}",
    data:{ids:delList},
    success:function (res) {
    if (res.status == 200) {
    layer.msg(res.msg,{time:1000},function () {
    window.location.href="{:url('comment/send_comment')}";
    })
    } else {
    layer.msg('失败', {icon: 2, time: 1000});
    }
    }
    });

    });
    break;

    //自定义头工具栏右侧图标 - 提示
    case 'LAYTABLE_TIPS':
    layer.alert('这是工具栏右侧自定义的一个图标按钮');
    break;
    }
    });
        public function send_comment_del_many()
        {
            if($this->request->isPost()){
    
                $arrDate  =$this->request->param('ids');
    //            dump($arrDate);die;
                foreach ($arrDate as $k => $v){
                    Db::name('ht_send_comment')->where('id',$v)->delete();
                }
                return json(['status'=>200,'msg'=>'成功']);
            }
    
        }

  • 相关阅读:
    SecureCRT的设置和美化
    strtod-strtod, 字符串 转 数字 函数
    Debug : array type has incomplete element type
    Linux上Core Dump文件的形成和分析
    centos7,进程最大打开文件数 too many open files错误
    不使用临时变量交换两个值
    C语言的设计理念
    K&R C vs ANSI C(数据类型提升)
    再也不怕C语言的声明了
    K&R C vs ANSI C(数据类型转换)
  • 原文地址:https://www.cnblogs.com/yehuisir/p/13602412.html
Copyright © 2011-2022 走看看