layui之layer打开table后分页无效的解决方法
1.原代码:
<body>
<div id="showalladdableavms" style="display: none;width:100%">
<table id="demo" lay-filter="test"></table>
</div> -->
</body>
<script>
filldata(table,"#demo","getDateForUserJurisdiction.gds");
layer.open({
type:1,
title:"添加机器",
maxmin:true,
area:["100%","100%"],
btn:["确认添加"],
content: $("#showalladdableavms").html(),
success: function (layero) {
var btn = layero.find('.layui-layer-btn');
btn.css({'position':'relative','top':"-93%","text-align":"left","left":"8%"});
},
btn1:function(index, layero){
//console.log(layero, index);
var res = getoperavms('demo');
console.dir(res)
}
});
function filldata(table,id,url){
table.render({
elem: id,
height:"560"
,url:url //数据接口
,method: 'POST'
,cellMinWidth: 80 //全局定义常规单元格的最小宽度,layui 2.2.1 新增
,page:true/* { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
first: true //显示首页
,last: true //显示尾页
} */
,limits : [10,20,30]
,limit:10
,request: {
pageName: 'page',//页码的参数名称,默认:page
}
,cols: [[ //表头
{checkbox:true}
,{field: 'id', title: 'ID', width:80, sort: true}
,{field: 'avm', title: '机器编号', width:80}
,{field: 'company', title: '公司名称', width:80}
,{field: 'area', title: '区域', width:80, sort: true}
,{field: 'circuit', title: '线路', width:80}
,{field: 'position', title: '位置', width: 177}
,{field: 'goodsxml', title: '商品库', width: 80, sort: true} ]]
,where : {
//传值 startDate : startDate,
allavm:'yes'
}
,response: {
// statusName: 'code' //数据状态的字段名称,默认:code
//,statusCode: 200 //成功的状态码,默认:0
//,msgName: 'message' //状态信息的字段名称,默认:msg
countName: 'total' //数据总数的字段名称,默认:count
,dataName: 'rows' //数据列表的字段名称,默认:data
}
/* done:function(){
layer.open({
type:1,
maxmin:true,
area:["800px","600px"],
content: $("#showalladdableavms")
});
} */
});
} </script>
2.现象:分页,选择框等无法操作,查了查说是使用html()方式得到的内容会丢失dom对象的事件,如果直接用dom会出现一直无法展示dom内容的问题。
3.解决:动态添加:
var dom = $("<div id='showalladdableavms' style='display:none;width:100%'><table id='demo' lay-filter='test'></table></div>");
$('body').append(dom)
这种方式可以很好的解决写死在页面里的dom对象打开时不展示,显示呈暗灰色调的问题,同时,dom对象的事件也得到了支持,完美
layui之layer打开table后分页无效的解决方法的更多相关文章
- 表格Table宽度设置无效的解决方法
表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...
- 用Mindjet MindManager 15 打开文件后停止响应的解决方法
这个是因为文件里面有很多规格不统一的注释(那个像小本子的图标[里面就是注释部分]),默认编码是utf-8的,如果不一样的话就会出现这个问题.网上大多数都是让咱们删掉注释再打开 弱弱的问一下,如果我都把 ...
- (转)WEB页面导出为Word文档后分页&横向打印的方法
<html> <HEAD> <title>WEB页面导出为Word文档后分页&横向打印的方法 </title> < ...
- 设置height:100%无效的解决方法
设置height:100%无效的解决方法 刚接触网页排版的新手,常出现这种情况:设置table和div的高height="100%"无效,使用CSS来设置height:" ...
- redhat linux enterprise 5 输入ifconfig无效的解决方法
redhat linux enterprise 5 输入ifconfig无效的解决方法 在安装完成linux后,进入终端,输入命令行ifconfig,会提示bash: ifconfig: comm ...
- windows 10 删除库后自动恢复的解决方法
目录 什么是windows 库? 手动删除不行吗? 如何正确的"删除"? title: windows 10 删除库后自动恢复的解决方法 date: 2019-06-09 15:4 ...
- WPF:指定的命名连接在配置中找不到、非计划用于 EntityClient 提供程序或者无效的解决方法
文/嶽永鹏 WPF 数据绑定中绑定到ENTITY,如果把数据文件做成一个类库,在UI文件中去应用它,可能遇到下面这种情况. 指定的命名连接在配置中找不到.非计划用于 EntityClient 提供程序 ...
- 移动端bug~~移动端:active伪类无效的解决方法【移动端 :active样式无效】
移动端:active伪类无效的解决方法[移动端 :active样式无效]2016-09-26 15:46:50 问题: 移动端开发的时候实现按钮的点击样式变化,但是在iphone[safiri Mo ...
- js中style.display=""无效的解决方法
本文实例讲述了js中style.display=""无效的解决方法.分享给大家供大家参考.具体解决方法如下: 一.问题描述: 在js中我们有时想动态的控制一个div显示或隐藏或更多 ...
随机推荐
- Android的缓存图片不在系统图库中显示的解决办法
Android的图库会在开机的时候扫描SD卡中的图片,视频等文件,有很多App的私有图片不想在图库中显示,就需要另外处理了. 解决办法:在缓存图片的文件夹中创建 .nomedia 文件. 1. &qu ...
- 洛谷【P1898】缘分计算
我对模拟的理解:http://www.cnblogs.com/AKMer/p/9064018.html 题目传送门:https://www.luogu.org/problemnew/show/P189 ...
- Nginx正则表达式之匹配操作符详解
nginx可以在配置文件中对某些内置变量进行判断,从而实现某些功能.例如:防止rewrite.盗链.对静态资源设置缓存以及浏览器限制等等.由于nginx配置中有if指令,但是没有对应else指令,所以 ...
- Python模块-requests(二)
会话对象 会话对象能够跨请求保持某些参数. 它也会在同一个 Session 实例发出的所有请求之间保持 cookie, 期间使用 urllib3 的 connection pooling 功能. 所以 ...
- Asp.net Core学习笔记
之前记在github上的,现在搬运过来 变化还是很大的,感觉和Nodejs有点类似,比如中间件的使用 ,努力学习ing... 优点 不依赖IIS 开源和跨平台 中间件支持 性能优化 无所不在的依赖注入 ...
- 使用struts2进行文件下载以及下载权限控制的例子
本测试有两个模块,一个是文件上上传,一个是文件下载,文件下载的时候会检查是否足有权限,如果没有,就会转发到登录页面,如果有权限,就会直接启动下载程序,给浏览器一个输出流. 下面直接上我的代码: 登录表 ...
- CentOS 7 rsync+inotify实现实时同步
测试环境如下: inotify-slave IP : 172.16.0.222 inotify-master IP : 172.16.0.233 对两台机的要求: 安装依赖包gcc: yum inst ...
- 查看Linux、Tomcat、JAVA版本信息
查看Linux.Tomcat.JAVA版本信息 [root@test1 bin]# cd /usr/local/tomcat/tomcat_jdt/bin/ [root@test1 bin]# sh ...
- javascript的DI
学习AngularJS的原因之一就是觉得他的DI很牛叉,为了更好的学习,在研究源码之前,想自己按照自己的思路先实现个DI,希望这个思路能够对学习源码有帮助. (function(){ var conf ...
- R语言对矩阵按某一列排序
[plain] view plaincopy a <- c(5,4,3,2,1) b <- c(1,2,3,4,5) c <- cbind(a,b) [plain] view pla ...