最近开发使用到了layer,第一次接触,把开发中遇到的问题,和使用的方法记录下来.
我们提供的服务有：成都网站建设、成都做网站、微信公众号开发、网站优化、网站认证、景德镇ssl等。为1000多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务，是有科学管理、有技术的景德镇网站制作公司
数据表格的展示.如下图显示.
2.1
2.2 导入layer包,在这里不多说,参考官网. http://www.layui.com/doc/
2.3 先从简单的来显示数据,最后,再来,删除,许可流转....循环渐进.
看代码
layui.use(['table'],function(){
var table = layui.table; // 加载
table.render({
elem: '#datagrid', // 这个是上面table的id
url: '这里是你的action',
cols: [[
{type:'checkbox'},
field:'index', title: '序号', width:80,templet:'#indexTpl',sort: true},
{field: 'id', title: '操作',align:'center',templet: '#checkboxisgs',width:250},
{field:'tsmxId', title: '推送详情',templet: '#checkboxistsmx',sort: true,width:150},
{field:'flag', title: '公示/未公示',templet: '#checkboxists',sort: true,width:120},
{field:'zzjgdm', title: '统一社会信用代码或组织机构代码',sort: true,width:200},
{field:'sqlx', title: '分类',width:300}
{field:'zhusuo', title: '机构地址',width:300},
{field:'sqlb', title: '说明',width:300}
]],
page: true, // 是否分页
height: 500,
height: 'full-272',
});
}
先说一下返回的数据格式:
{"count":53,"data":[
{"caoR":"admin","id":17,"icon":"","parentId":0,"title":"系统设置","paiXu":0,"caoDate":"2017-12-28","spread":"false","href":"//","islock":"0"},
{"caoR":"admin","id":19,"icon":"","parentId":17,"title":"角色管理","paiXu":1,"caoDate":"2017-12-25","spread":"false",
"href":"jsp/sysbase/rolemanager.jsp","islock":"0"}],
"code":0,"msg":""}
其中count:是总条数
msg: 可以写自己想返回的错误信息
另外想分页时候,后台接受参数为:
page 当前页
limit 当前页条数 默认10
{{d.LAY_TABLE_INDEX+1}}
这个序号是针对当前页来分 比如说第一页 序号1-10 第二页仍然是1-10
那么怎么让序号叠加?
代码:
{type:'numbers', title: '序号', width:80,sort: true},
只需要把上面的序号监听,换成这句就可以了.
怎么添加?
添加
var $ = layui.$,active = {
add: function(){
var checkStatus = table.checkStatus('datagrid')
layer.open({
title: "增加信息",
type: 2,
maxmin: true,
area: ['680px', '580px'],
content: '添加页面',
// 下面这句是,添加页面关闭后,刷新本页面.
end: function () {
location.reload();
}
});
},
}
在table中如何显示?
流转详情,删除?
代码如下:
