layui 多选框根据条件限定选中个数
layui table封装
//layui table 请求封装 带分页
RenderTable: function(element, params, title, toolbar, cols, callback, other, autowidth, totalRow, height) {
var that = this;
var url = other ? other : that.URL.http;
var geturl = “”;
for (var key in params) {
geturl += key + ‘=’ + params[key] + ‘&’;
}
var newurl = url + ‘?’ + geturl;
newurl = newurl.substring(0, newurl.length - 1);
console.log(newurl)
//table表格渲染
layui.use(‘table’, function() {
var table = layui.table;
table.render({
elem: element,
url: newurl,
toolbar: toolbar ? toolbar : “”,
title: title ? title : “”,
cellMinWidth: autowidth ? autowidth : “”,
totalRow: totalRow ? true : false,
height: height ? ‘full-’ + parseInt(height) : ‘’,
cols: cols,
page: false
});
if (callback) {
callback(table);
}
});
},
//数据渲染表格 不带分页
DataTable: function(element, params, title, toolbar, cols, callback, other, autowidth, totalRow, height) {
var that = this;
that.load(’’, params, function(res) {
if (res.code == 0) {
var list = res.data;
var msg = parseInt(res.message);
var pages = res.page;
//table表格渲染
layui.use(‘table’, function() {
var table = layui.table;
table.render({
elem: element,
data: list,
toolbar: toolbar ? toolbar : “”,
title: title ? title : “”,
cellMinWidth: autowidth ? autowidth : “”,
totalRow: totalRow ? true : false,
height: height ? ‘full-’ + parseInt(height) : ‘’,
limit: msg > 50 ? msg : 50,
cols: cols
});
if (callback) {
callback(table, msg, pages);
}
});
}
}, other)
},
调用方法
html
<div class="main-content">
<table class="layui-hide" id="test" lay-filter="table"></table>
<div id="pagenuns"></div>
</div>
js
shop.DataTable("#test", {//请求参数
token: shop.token,
sFkey :that.OD.key,
sFcode :that.OD.code,
sFmanage :that.OD.manage,
sFstatus:"",
sFpageno :that.OD.currPage,
sFpageSize :that.OD.pageSize,
}, "管理数据", '', [
[{type:'checkbox'},{
field: 'name',
title: '单位名称',
sort: true
}, {
field: 'business',
title: '主营业务'
}, {
field: 'manager',
title: '负责人',
sort: true
}, {
field: 'tele',
title: '负责人电话',
}, {
field: 'bureau',
title: '*管辖单位',
},
]
], function(table, msg) {
that.OD.total = msg;
console.log(that.OD.total);
$('.layui-table-header .laytable-cell-checkbox input').attr('disabled','disabled');
$('.layui-table-header .laytable-cell-checkbox div').hide();
//分页器
layui.use(['laypage', 'layer'], function() {
var laypage = layui.laypage,
layer = layui.layer;
// 分页
laypage.render({
elem: 'pagenuns',
count: parseInt(that.OD.total),
curr: that.OD.currPage,
limit: that.OD.pageSize,
layout: ['count', 'prev', 'page', 'next', 'limit', 'skip'],
jump: function(obj, first) {
console.log(obj)
that.OD.currPage = obj.curr;
that.OD.pageSize = obj.limit;
console.log(that.OD.currPage);
if (!first) {
that.Third();
}
}
});
table.on('checkbox(table)', function(obj){
console.log(obj); //当前对象
var checked=obj.checked;
var id=obj.data.Fid;
if(checked){
if(that.OD.consList.length>=parseInt(that.OD.limit)){//调用数量限制
//$(obj.tr).find('td div.laytable-cell-checkbox input[type="checkbox"]').prop('disable',true)
$(obj.tr).find('td div.laytable-cell-checkbox div.layui-form-checkbox').removeClass('layui-form-checked')//取消选中样式
$(obj.tr).find('td div.laytable-cell-checkbox div.layui-form-checkbox').click();//再次点击取消选中
$(obj.tr).find('td div.laytable-cell-checkbox div.layui-form-checkbox ').addClass('layui-btn-disabled')//禁止选择样式
window.top.layer.msg("最多可选"+that.OD.limit+",您已达到上限!",{time:1000});
}else{
that.OD.consList.push({
id:obj.data.Fid,
name:obj.data.Fname
});
}
}else{
shop.RemoveAttr(that.OD.consList,"id", id)
}
console.log(that.OD.consList);
});
})
},"","","",height);
推荐阅读