row 操作跟触发复选框不冲突，row操作选中复选框

最新推荐文章于 2023-11-23 10:14:57 发布

原创最新推荐文章于 2023-11-23 10:14:57 发布 · 344 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#layui

html 专栏收录该内容

1 篇文章

订阅专栏

本文介绍了如何使用layui库在DataGrid表格中实现行级事件处理，通过阻止事件冒泡并同步表格状态，确保了复选框的选择状态与数据持久化。关键操作包括设置checkbox状态、更新表格缓存和初始化Tab功能。

//用于行工具阻止事件冒泡
table.on('row(DataGrid)', function (obj) {
layui.stope()
var flag = !obj.tr.find(':checkbox:first').prop('checked');
var data = obj.data;
var index = obj.tr.index();
obj.tr.find(':checkbox').prop('checked', flag);
if (flag) {
obj.tr.find('.layui-form-checkbox').addClass('layui-form-checked');
} else {
obj.tr.find('.layui-form-checkbox').removeClass('layui-form-checked');

};
layui.each(table.cache.DataGrid, function (i, m) {
if (index == m.LAY_TABLE_INDEX) {
m.LAY_CHECKED = flag;
}
});

initTab();
$(".layui-tab").attr("data-masterid", data.Id);
$(".layui-tab li.layui-this").click();
});