layui相关问题总结
1.layui table回显选中
1) radio:
done:function(res, curr, count){
for(var i = 0; i < res.data.length; i++){
for(var j = 0; j < vm.chosenInfo.waterInfo.length; j++){
if(res.data[i].meterId == vm.chosenInfo.waterInfo[j].meterId){
res.data[i]["LAY_CHECKED"] = 'true';
var index= res.data[i]['LAY_TABLE_INDEX'];
$('tr[data-index=' + index + '] .layui-form-radio').click();
}
}
}
}
2) checkbox:
done:function(res, curr, count){
var num = 0;
for(var i = 0; i < res.data.length; i++){
for(var j = 0; j < vm.chosenInfo.equipment.length; j++){
if(res.data[i].materialId == vm.chosenInfo.equipment[j].materialId){
num++;
res.data[i]["LAY_CHECKED"] = 'true';
var index= res.data[i]['LAY_TABLE_INDEX'];
$('tr[data-index=' + index + '] input[type="checkbox"]').prop('checked', true);
$('tr[data-index=' + index + '] input[type="checkbox"]').next().addClass('layui-form-checked');
}
}
}
if(num == res.data.length){
$("th div input[type=checkbox]").next().addClass("layui-form-checked");
}
}
2.layui table高度设定
//动态监听表头高度变化,冻结行跟着改变高度
$(".layui-table-header tr").resize(function () {
$(".layui-table-header tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
});
});
//初始化高度,使得冻结行表头高度一致
$(".layui-table-header tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-header table tr")[index]).height($(val).height());
});
//动态监听表体高度变化,冻结行跟着改变高度
$(".layui-table-body tr").resize(function () {
$(".layui-table-body tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
});
});
//初始化高度,使得冻结行表体高度一致
$(".layui-table-body tr").each(function (index, val) {
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height());
if(index==0){
$($(".layui-table-fixed .layui-table-body table tr")[index]).height($(val).height()-1);
}
}); // 以下两行视情况而定
$('.layui-table-fixed.layui-table-fixed-r .layui-table-header').css({
'margin-bottom':'-1px',
'z-index':'99999'
})
$('.layui-table-fixed.layui-table-fixed-l .layui-table-header').css({
'margin-bottom':'0px',
'z-index':'99999'
})
layui相关问题总结的更多相关文章
- layui相关总结
表格操作实例1: https://sun_zoro.gitee.io/layuitableplug/testTableCheckboxDisabled?v0.1.9
- layui相关用法总结
1.关闭当前弹出层 parent.layer.close(parent.layer.getFrameIndex(window.name));
- Layui的一点小理解(上)
首先声明这是个人的一点理解,如有不对之处请指正,以下的例子有在官网上看到的,有的是自己写的.还是老规矩最后会附上官网的,如有不明白之处,请查看文档或留言. 既然说Layui,当然要简单的介绍以下什么是 ...
- asp.net core封装layui组件示例分享
用什么封装?自然是TagHelper啊,是啥?自己瞅文档去 在学习使用TagHelper的时候,最希望的就是能有个Demo能够让自己作为参考 怎么去封装一个组件? 不同的情况怎么去实现? 有没有更好更 ...
- .net mvc + layui做图片上传(二)—— 使用流上传和下载图片
摘要:上篇文章写到一种上传图片的方法,其中提到那种方法的局限性,就是上传的文件只能保存在本项目目录下,在其他目录中访问不到该文件.这与浏览器的安全性机制有关,浏览器不允许用户用任意的路径访问服务器上的 ...
- layui学习<一>
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- layui弹出层之应用实例讲解
从酒店管理系统到智能门锁及其现在的资源共享平台,layui框架,我们团队用的比较多的就是这个layui弹出层. layui弹出层,除了页面iframe层我们比较常用还有就是表单校验和其他相关的友好提示 ...
- layui表格的新增和编辑功能前端代码
html页面的代码(注意:引入layui相关的css): <div class="layui-form-item"> <label class="lay ...
- layui的多文件列表上传功能前端代码
html页面的代码(注意:引入layui相关的css): <div class="layui-upload" style="margin-left: 130px&q ...
- .Net之Layui多图片上传
前言: 多图上传在一些特殊的需求中我们经常会遇到,其实多图上传的原理大家都有各自的见解.对于Layui多图上传和我之前所说的通过js获取文本框中的文件数组遍历提交的原理一样,只不过是Layui中的up ...
随机推荐
- windows用curl报错
https://www.shuzhiduo.com/A/kmzLRmgl5G/ IE浏览器 -> 设置 -> Internet选项 -> 安全 -> 本地Internet -& ...
- <string> <cstring> <string.h>
<string>是C++标准库头文件,包含了拟容器class std::string的声明(不过class string事实上只是basic_string<char>的type ...
- MyBatis_10(分页插件)
主题:分页插件 --> 针对:查询功能 一.分页插件使用步骤: 1-添加依赖 <!-- https://mvnrepository.com/artifact/com.github.page ...
- 2023 01 19 HW
2023 01 19 HW Okay, then let's start. Okay. Maybe Karina, we start with the C2 design freeze. Yeah, ...
- raise EOFError("Compressed file ended before the " EOFError: Compressed file ended before the end-of-stream marker was reached
参考: EOFError: Compressed file ended before the end-of-stream marker was reached解决办法(在Windows下查看已下载的M ...
- From逗号是Sql92语法
From 逗号是Sql92语法 Join on 是 Sql99语法 Sql92 外连接(+)语法,mysql不支持,oracle支持 (inner) join on 内连接 left / righ ...
- (Yocto)Imx8mp的时间结构
1.构成图 #kernel\time\timekeeping.c #drivers\rtc\class.c 1.time date source 解释 rx8010sj: 自己定制的开发板 ...
- OSPF配置知识总结2(单区域)
OSPF配置知识总结2 静态路由有静态路由的好处,但也有弊端,牵一发动全身,在一个路由路径上,只要变一个,其他所有的路由器上的静态路由都要跟着改变. 用动态路由OSPF很简单就能解决这个问题.如下: ...
- restful的10个规范、序列化和反序列化的名词解释
# 概念 REST全称是Representational State Transfer,中文意思是表述:表征性状态转移. RESTful是一种定义Web API接口的设计风格,尤其适用于前后端分离的应 ...
- Unity旧版图集和新版图集
1.关于旧版图集 ===>结论:设置PackingTag就可以了. ===>分析:设置好PackingTag,那么在进行打包的时候,同一个标签的会被打到1个图集里面,图集最大为2048x2 ...