layui 数据表格根据状态判断是否显示多选框

需求描述:状态为已办结的不能再进行处理

开发思路:

如图,状态为“已办结”的不显示多选框按钮

代码:

html中,实现是否显示多选框

<script type="text/html" id="checkbd">
    {{#  if (d.status!='已办结'){ }}
    <input type="checkbox" name="siam_one" title="" lay-skin="primary" data-aid="{{ d.sheetId }}" data-bid="{{ d.userName }}" data-cid="{{ d.phongNo }}">
    {{#  } }}
</script>

js中,数据表格列代码,实现多选框

{
    templet: "#checkbd",
    title: "<input type='checkbox' name='siam_all' title='' lay-skin='primary' lay-filter='siam_all'> ",
    width: 60,
},

js中,实现全选

layui.use('form', function () {
    form = layui.form;
    form.on("checkbox(siam_all)", function () {
       var status = $(this).prop("checked");
       $.each($("input[name=siam_one]"), function (i, value) {
           $(this).prop("checked", status);
       });
       form.render();
    });
}); 

js中,实现获取多选框的值

var sheetIds = [];
var userNames = [];
var phongNos = [];
$.each($("input[name=siam_one]:checked"), function (i, value) {
    sheetIds[i] = $(this).attr("data-aid");
    userNames[i] = $(this).attr("data-bid");
    phongNos[i] = $(this).attr("data-cid");
});
console.log("sheetIds=");
console.log(sheetIds);
console.log("userNames=");
console.log(userNames);
console.log("phongNos=");
console.log(phongNos);

 

参考链接:

https://blog.csdn.net/weixin_48850734/article/details/123130351

https://blog.csdn.net/zyq_1020/article/details/114161948

https://www.bbsmax.com/A/RnJW6eYyzq/

posted @ 2022-06-14 12:09  小二柯  阅读(560)  评论(0编辑  收藏  举报