html代码如下
<script>
layui.use('table', function(){
var table = layui.table;
table.render({
elem: '#test'
,url:'/demo/php/select.php'
,method:'post'
,toolbar: '#toolbarDemo' //开启头部工具栏,并为其绑定左侧模板
,limit: 10
,limits: [10, 20, 30]
,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义,去除该参数即可
title: '提示'
,layEvent: 'LAYTABLE_TIPS'
,icon: 'layui-icon-tips',
}]
,title: '用户数据表'
,cols: [[
{type: 'checkbox', fixed: 'left'}
,{field:'id', title:'ID', width:80, fixed: 'left', unresize: true, sort: true}
,{field:'username', title:'用户名', width:120, edit: 'text'}
,{field:'age', title:'年龄', width:120, edit: 'text'}
,{field:'sex', title:'性别', width:120, edit: 'text'}
,{field:'phonenumber', title:'电话号码', width:120, edit: 'text'}
]]
,page: true
,parseData: function (res) {
var data = {
"code": 0, //解析接口状态
"msg": res.message, //解析提示文本
"count":res.total, //解析数据长度 //这里是总数量
"data": res.data.item //解析数据列表 这里的data即是渲染到表格中的数据, 因为我传过来的json数据是list作为key值的,所以这里是个list 根据你自己的json数据进行更改
};