layui数据表格
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#testtable'
,url:'/shsm/tablexs'
,method: 'POST'
,toolbar: '#toolbarDemo' //开启头部工具栏,并为其绑定左侧模板
,defaultToolbar: []
,title: '用户数据表'
,initSort: {
field: 'id' //排序字段,对应 cols 设定的各字段名
,type: 'desc' //排序方式 asc: 升序、desc: 降序、null: 默认排序
}
,even: true //开启隔行背景
,height: 580 //容器高度
,loading: true
,cols: [ [
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, sort: true} //unresize: true,fixed: 'left',
,{field:'ddzt', title:'订单状态', width:100, sort: true, templet: '#sexTpl'}
,{field:'ddshname', title:'用户名', width:100, sort: true }
,{field:'ddshtel', title:'电话', width:120, sort: true }
,{field:'ddshaddr', title:'地址', width:200,sort: true}
,{field:'ddzje', title:'订单金额', width:90,sort: true}
,{field:'ddshsj', title:'订单日期', templet:'<div>{{ layui.util.toDateString(d.ddshsj, "yyyy-MM-dd HH:mm:ss") }}</div>',minWidth:150, sort: true}
,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:80}
] ]
// ,page: true
});
<table class="layui-hide" id="testtable" lay-filter="test"></table>
下方是 {field:'ddzt', title:'订单状态', width:100, sort: true, templet: '#sexTpl'} 附加的方法
<script type="text/html" id="sexTpl">
{{# if(d.ddzt === '0'){ }}
<span style="color: #FF1493;">等待送货</span>
{{# } else { }}
{{ d.ddzt }}
{{# } }}
</script>
···