jsp中:
<form class="layui-form">
<table class="layui-table" lay-even="" lay-skin="row">
<thead>
<tr>
<th style="text-align: center" width="5%"><input type="checkbox" name="selectall" lay-filter="selectall"/></th>
</tr>
</thead>
<tbody id="gridData" align="center">
</tbody>
</table>
</form>
js中:
//全选与全取消
form.on('checkbox(selectall)', function(data){
if ($(this).is(':checked')) {
$('input[name="checkId"]').each(function (index, item) {
//此处如果用attr,会出现第三次失效的情况
item.checked = data.elem.checked;
});
} else {
$('input[name="checkId"]').each(function (index, item) {
item.checked = data.elem.checked;
});
}
form.render('checkbox');
});
//取消单个复选框时取消全选选中状态
form.on('checkbox(checkId)', function(data){
var item = $('input[name="checkId"]');
for (var i = 0; i < item.length; i++) {
if (item[i].checked == false) {
$('input[name="selectall"]').prop("checked", false);
form.render('checkbox');
break;
}
}
//如果都勾选了 勾上全选
var all=item.length;
for (var i = 0; i < item.length; i++) {
if (item[i].checked == true) {
all--;
}
}
if(all==0){
$('input[name="selectall"]').prop("checked", true);
form.render('checkbox');}
});
function rendData(res) {
if (!res.success) {
layer.alert(res.msg);
return;
}
var data = res.data;
var sb = [];
for (var i = 0; i < data.length; i++) {
sb[sb.length] = '<tr>';
sb[sb.length] = '<td><input type="checkbox" name="checkId" value="' + data[i].procId + '" lay-skin="primary" title="" lay-filter="checkId"></td>';
sb[sb.length] = '<td width="15%">' + data[i].procName + '</td>';
sb[sb.length] = '</tr>';
}
$("#gridData").html(sb.join(''));
form.render("checkbox");
}