LayUI 数据表格模板 - Post 请求数据
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>LayUI 数据表格模板 - Post 请求数据</title>
<link rel='stylesheet' href='https://cdn.staticfile.org/layui/2.5.6/css/layui.min.css'>
</head>
<body>
<table id='demo' lay-filter='test'></table>
<script src='https://cdn.staticfile.org/jquery/3.5.1/jquery.min.js'></script>
<script src='https://cdn.staticfile.org/layui/2.5.6/layui.min.js'></script>
<script>
layui.use(['table'], function(){
var table = layui.table;
//第一个实例
table.render({
elem: '#demo'
,height: 500
,url: '/api/data' //数据接口,post方式请求
,method: 'post' //默认get请求
,page: true //开启分页
,cols: [[ //表头
{field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'}
,{field: 'username', title: '用户名', width:120}
,{field: 'email', title: '邮箱', minWidth: 150}
,{field: 'sex', title: '性别', width:80, sort: true}
,{field: 'city', title: '城市', width:100}
,{field: 'sign', title: '签名', minWidth: 200}
,{field: 'experience', title: '积分', width:80, sort: true}
,{field: 'score', title: '评分', width:80, sort: true}
,{field: 'classify', title: '职业', width:100}
,{field: 'wealth', title: '财富', width:135, sort: true}
]]
});
});
</script>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/ncpV 著作权归作者所有。请勿转载和采集!