layui table 多行删除(id获取)

最新推荐文章于 2023-10-25 09:27:56 发布

原创最新推荐文章于 2023-10-25 09:27:56 发布 · 6.4k 阅读

10 ·

CC 4.0 BY-SA版权

本文介绍如何使用layui框架实现表格的多选与批量删除功能，包括JavaScript代码逻辑、事件监听及确认对话框的使用。

<button class="layui-btn layui-btn-danger" data-type="getid" onclick="delAll()">删除所有选中行</button>

js:

table.on('checkbox(table)', function(obj){
    var data = obj.data;
});
layui.jquery, active = {
    getid: function () {
        var arr = [];
        var checkStatus = table.checkStatus('tableid')
            , data = checkStatus.data;
        for (var i = 0; i < data.length; i++) {    //循环筛选出id
            arr.push(data[i].id);
        }
        $("#ids").val(arr);
    }
}
$('.layui-btn').on('click', function(){
    var type = $(this).data('type');
    active[type] ? active[type].call(this) : '';
});

function delAll(){
        layer.confirm('确定删除吗?', {btn: ['确定删除', '取消']}, function (index) {
            var a1 = $("#ids").val(); //取得已获取的ids
            $.ajax({  
        .......       
            });
        });

}