最近开发使用到了layer,第一次接触,把开发中遇到的问题,和使用的方法记录下来.
我们提供的服务有:成都网站建设、成都做网站、微信公众号开发、网站优化、网站认证、景德镇ssl等。为1000多家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的景德镇网站制作公司
数据表格的展示.如下图显示.
2.1
2.2 导入layer包,在这里不多说,参考官网. http://www.layui.com/doc/
2.3 先从简单的来显示数据,最后,再来,删除,许可流转....循环渐进.
看代码
这个序号是针对当前页来分 比如说第一页 序号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中如何显示?
流转详情,删除?
代码如下:
这里仅仅是 在talbe中显示删除.流转详情.?怎么触发事件?
代码参考:
//监听事件
table.on('tool(Grid)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
var data = obj.data; //获得当前行数据
var layEvent = obj.event; //获得 lay-event 对应的值(也可以是表头的 event 参数对应的值)
if(layEvent === 'remove'){ //编辑
var id = data.id;
layer.confirm('确定要删除?',{title: "系统提示",anim: 1,icon: 3,closeBtn: 0},function(index){
// 这里可以写自己方法.
layer.alert("删除成功!",{title: "系统提示",icon: 1,closeBtn: 0},function(index){
//关闭删除窗口,并刷新table
table.reload("Load");
});
});
}else if(layEvent === 'update'){ //编辑
}
怎么知道监听是那个事件?
其中
layEvent === 'update' 中update,就是监听不同触发的事件,进行判断的.
Grid 是:
中 lay-filter 的值.
分享题目:layer之数据表格
文章起源:
http://cxhlcq.com/article/phoidh.html