mydal

怕光阴流逝 让一切都作废

0%

tp5全选删除

发表于 更新于 分类于
本文字数： 2.6k 阅读时长 ≈ 6 分钟

tp5实现后台模块全选删除

技术栈:ajax layer.js tp5

1575019926362.png

一个让你想到即可做到的web弹窗/层 解决方案 http://layer.layui.com/

实现复选框全选

1
2
<th class="text-center"><input type="checkbox" class="all"  style="!important; opacity: 1.2;position: static;">
</th>
1
2
3
4
5
6
7
<form class="piliangshanchan">  //为了实现ajax 序列化表单的值
<td class="text-center"><input type="checkbox" value="{$value.id}"
                               name="id[]" id="checkbox"
                               class="cheidbox"
                               style="!important; opacity: 1.2;position: static;">
</td>
</form>
1
2
3
<button type="submit" tooltip="删除管理员" class="btn btn-danger btn-sm shi"
        onclick="delAll()"><i class="fa fa-trash-o"></i> 批量删除
</button>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// 全选
$('#all').change(function () {
    if ($(this).is(':checked')) {
        $(':checkbox').prop("checked", true);
    } else {
        $(':checkbox').prop("checked", false);
    }
});

//反选
$(".cheidbox").change(function(){
    var len=$(".cheidbox").length;  //获取所有小复选框的个数
    var len2=$("input.cheidbox:checked").length;  //获取选中的小复选框个数
    if(len==len2){
        $('#all').prop("checked",true);
    }else{
        $('#all').prop("checked",false);
    }

});

发送ajax请求

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
//批量删除提交
function delAll() {
    layer.confirm('确认要删除吗？', function (index) {
        if ($('.cheidbox').is(':checked')) {
            $.ajax({
                url: "{:url('admin/delAll')}",
                data: $('.piliangshanchan').serialize(), //给后台发送序列化表单值得结果
                dataType: "json",
                type: 'post',
                async: false,
                success: function (res) {
                    // console.log(res);
                    if (res.status == 1) {
                        layer.alert(res.message + "，共删除" + res.num + "数据", {icon: 6}, function () {
                            window.location.reload();  //页面刷新
                            // layer.close(index) - 关闭特定层
                            // 获得iframe索引
                            var index = parent.layer.getFrameIndex(window.name);
                            //关闭当前frame
                            parent.layer.close(index);

                        });
                    } else {
                        layer.alert(res.message, {icon:1}, function () {
                            window.location.reload();
                            // 获得frame索引
                            var index = parent.layer.getFrameIndex(window.name);
                            //关闭当前frame
                            parent.layer.close(index);

                        });
                    }
                }

            })
        } else {
            layer.msg('请选择~~', {icon: 2});

        }
    });
}

后台控制器

1
2
3
4
5
6
7
8
9
10
11
12
13
//批量删除用户
public function delAll()
{
    $data = $this->request->param();  //获取当前请求参数的值  拿到ajax发送的值
    $allid = $data['id'];
    $res=AdminModel::destroy($allid);
    $num=count($allid)
    if($res){
        return ['status'=>1,'message'=>'删除成功','num'=>$num];
    }else{
        return ['status'=>0,'message'=>'删除失败'];
    }
}