<form>
<input type="button" value="查询" class="btn" id="reloadTable"
style="width: 50px; height: 25px; cursor: pointer; margin-bottom: 1px;"/>
<table id="demo" lay-filter="test"></table>
</form>
<script type="text/javascript">
var table=null;
var layer=null;
layui.use(['table','layer'], function(){
table = layui.table,
layer = layui.layer;
table.render({
elem: '#demo',
limit: 20, //每页显示数据条数
height: 'auto',
cellMinWidth: 80, //全局定义常规单元格的最小宽度
size:'sm',
method:'post',
url: '',
where:{
type:$('input[name=type]').val(),
createTime:$('input[name=createTime]').val()
},
page: true,
cols: [[
{field:'zizeng', width:80, title: '序号',align: 'center',templet:'#zizeng'}
{field:'type', title: '', sort: true,align :'center'},
{field:'mailno', title: '',align :'center'},
{field:'sex', title: '', sort: true,align :'center'},
{field:'playmoney',title: '',align :'center'},
{field:'sign', title: '',align :'center'},
{field:'smomey', title: '', sort: true,align :'center'},
{field: 'createTime', title: '',
templet :function (row){
return createTime(row.createTime);
}
}
]]
});
$('#reloadTable').click(function(){
parent.layer.msg('查询中...', {icon: 16,shade: 0.3,time:700});
table.reload('demo',{
page: {
curr: 1
}
,where:{
type:$('input[name=type]').val(),
createTime:$('input[name=createTime]').val()
}
});
});
});
//时间转换
function createTime(v){
var date = new Date(v);
var y = date.getFullYear();
var m = date.getMonth()+1;
m = m<10?'0'+m:m;
var d = date.getDate();
d = d<10?("0"+d):d;
var h = date.getHours();
h = h<10?("0"+h):h;
var M = date.getMinutes();
M = M<10?("0"+M):M;
var str = y+"-"+m+"-"+d+" "+h+":"+M;
return str;
}
</script>
//序号自增
<script type="text/html" id="zizeng">
{{d.LAY_TABLE_INDEX+1}}
</script>
本博客转载自:https://blog.csdn.net/qq_26173219/article/details/79709644
在原博主的基础上,我添加了:序号自增,自主定义每页显示数据数,单元格的最小宽度,数据查询功能。