对layui数据表格动态cols(字段)动态变化详解
时间:2021-04-02 09:45:49|栏目:JavaScript代码|点击: 次
如搜索查询时,常会遇到按日期时间段查询,并显示查询的每个日期的数据,后台拼装数据此处不讨论。
把表格渲染封装在函数里面,cols_arr是传入的字段数组
function tableRender(cols_arr){
table.render({
elem: '#demo'
, url: 请求地址 //数据接口
, method: 'post'
, page: true //开启分页
, cols: cols_arr
, id: 'demo'
, limit: 10
, limits: [10, 20, 50, 100, 200, 500]
, done: function (res) {}
});
}
监听搜索提交
// 搜索
form.on('submit(demo1)', function (obj) {
var start_date = obj.field.start_date;
var end_date = obj.field.end_date;
if (start_date != '' && end_date != ''){
var all_date = getAll(start_date, end_date);
if ( all_date.length>7){
layer.msg('查询天数不得超过7天', {icon: 2, anim: 6});
return false;
}
window.cols_arr[0] = [];
window.cols_arr[0][0] = {field:'group_id', title: '群号', align: 'center'};
all_date.forEach(function(value,i){
window.cols_arr[0][i+1]=({field: value, title: value, align: 'center'})
})
}
tableRender(window.cols_arr);
table.reload('demo', {
page: {
curr: 1
},
where: {
all_date: all_date
}
});
return false;
});
如果只是重载,cols属性不会改变,解决思路:重载前执行一次封装了渲染的函数,也就是tableRender();用全局变量或传参的形式都行
上一篇:浅析C/C++,Java,PHP,JavaScript,Json数组、对象赋值时最后一个元素后面是否可以带逗号
栏 目:JavaScript代码
下一篇:在table中插入多行,能使用与insertAdjacentHTML相似的功能吗?
本文标题:对layui数据表格动态cols(字段)动态变化详解
本文地址:http://www.codeinn.net/misctech/92865.html






