layui中如何实现多行批量审核功能

表格中有austate一列为审核状态，现在想实现勾选行复选框后，点击审核按钮，修改多行的austate值为true，请各位给予指导，呵呵，最好有代码注释参考。

示例代码如下，里面有注释，题主自己看下，本地数据测试，远程加载题主自己改url配置，远程数据注意数据结构

 
 
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <title>表格操作 - layui</title>

  <link rel="stylesheet" href="../src/css/layui.css">

  <style>
  body{padding: 20px; /*overflow-y: scroll;*/}
  </style>
</head>
<body>

<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
      <button class="layui-btn layui-btn-sm" lay-event="CheckData">审核</button>
  </div>
</script>

<script type="text/html" id="usernameTpl">
  <a href="" class="layui-table-link">{{d.username || ''}}</a>
</script>

<script type="text/html" id="checkboxTpl">
  <input type="checkbox" name="" title="锁定" checked>
</script>

<script type="text/html" id="LAY_table_tpl_email">
  <span {{# if(!d.activate){ }}style="color:#999"{{# } }}>{{ d.email }}</span>
</script>

<table id="test" lay-filter="test"></table>

<script xsrc="../src/layui.js" src="http://www.layuicdn.com/layui-v2.5.3/layui.js" charset="utf-8"></script>
<script>
    layui.use(['table'], function () {
        ///测试数据
        var data = [
            {
                "id": "10001",
                "username": "杜甫",
                "austate": "false"
            },
            {
                "id": "10002",
                "username": "李白",
                "austate": "false"
            },
            {
                "id": "10003",
                "username": "王勃",
                "austate": "false"
            },
            {
                "id": "10004",
                "username": "李清照",
                "austate": "false"
            },
            {
                "id": "10005",
                "username": "冰心",
                "austate": "false"
            }
        ] 
        /////////////////

        var table = layui.table, $ = layui.$;
        //渲染
        window.ins1 = table.render({
            elem: '#test'
            , height: 400
            , title: '用户数据表'
            , data: data
            , totalRow: true
            , limit: 30
            , toolbar: '#toolbarDemo'
            , defaultToolbar: []
            , cols: [[
                { type: 'checkbox',fixed:'left' }
                , { field: 'id', title: 'ID', width: 80,  unresize: true, sort: 0 }
                , { field: 'username', title: '用户名', width: 120, templet: '#usernameTpl' }
                , { field: 'austate', title: '审核状态', width: 150,  sort: 0 }
            ]]

            , error: function (res, msg) {
                console.log(res, msg)
            }

        });
        //工具栏事件
        table.on('toolbar(test)', function (obj) {
            switch (obj.event) {
                case 'CheckData':
                    var checkData = table.checkStatus(obj.config.id);//获取勾选的数据
                    if (checkData.data.length == 0) {
                        layer.msg('请选择要审核的数据！');
                        return 
                    }
                    //如果要更新数据库，可以用$.ajax发送数据行ids到服务器进行跟新后再执行下面的代码更新客户端UI
                    var ids = checkData.data.map(i => i.id).join(',');
                    console.log(ids);
                    //ajax操作，更多ajax操作看这个api，实际是jquery.ajax：https://www.w3school.com.cn/jquery/ajax_ajax.asp
                    /*$.ajax({
                        url: '更新网址',
                        type: 'post',
                        data: { ids: ids },
                        complete: function (xhr) {
                            alert('服务器端返回\n'+xhr.responseText)
                        }
                    });*/


                    //如果复选框列是fixed定位用下面的
                    var trs = $('div[lay-id="test"] .layui-table-main tr')
                    $('div[lay-id="test"] .layui-table-fixed :checkbox:checked').each(function () {
                        var index = $(this).closest('tr')[0].dataset.index; 
                        trs.filter(`[data-index="${index}"]`).find('td:eq(3) div').html('true');//注意修改austate所在列下标，从0开始
                    });

                    /*//复选框非fixed定位用下面的
                    //如果表格id不是test注意修改这里
                    $('div[lay-id="test"] .layui-table-main :checkbox:checked').each(function () {
                        var tr = $(this).closest('tr');
                        tr.find('td:eq(3) div').html('true');//注意修改austate所在列下标，从0开始
                    });*/

                    break;
            };
        });

    });
</script>
</body>
</html>

API文档：http://layui-doc.pearadmin.com/doc/modules/table.html#methodRender?%ra

修改提交后，调用table.reload方法
http://layui.site/doc/modules/table.html#reload

代码参考相当于直接告诉你答案了你需要自己思考问题才能学习技术：勾选需要审核的数据后获取勾选的数据ID 然后根据id逐一设置审核状态然后刷新列表即可

文档里面写的挺清楚的，只需要在这个事件里面做处理就行了

table.on('checkbox(test)', function(obj){
  console.log(obj); //当前行的一些常用操作集合
  console.log(obj.checked); //当前是否选中状态
  console.log(obj.data); //选中行的相关数据
  console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
});

加油，解决了么

这个涉及一点点UI内容，应该有相关控件可以解决

这么简单也来问，看来真的是混子

https://www.cnblogs.com/sgm4231/p/12966323.html

你解决了不？如果没有，可以及时来交流！！！

楼上的专家，慎重！