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 ...
随机推荐
- postgresql添加系统表报错
1.添加系统表后,执行make install报如下错误,未自动生成下面两个文件cp: cannot stat './catalog/ux_user_status_d_compatible.h': N ...
- vue2的响应式原理
响应式的话,主要指的是这个状态改变以后,视图要去主动更新 这个过程,vue是通过两个步骤来实现的 1 数据的劫持 数据劫持也叫做数据拦截,通过Object.defineProperty来把对象中的每一 ...
- source 跳过登录账号的方法
1 安装 git windows 选择版本为 Git-2.29.2.2-64-bit 2 启动sourcetree 的安装 选择版本为 SourceTreeSetup-2.5.5 2.1 第一次启动 ...
- matlab画图之plot画折线图
Matlab绘制折线图 使用plot(x,y)函数创建折线图时,x,y有以下要求: ①如果 X 和 Y 都是向量,则它们的长度必须相同.plot 函数绘制 Y 对 X 的图. ②如果 X 和 Y 均为 ...
- css 多行隐藏
overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box- ...
- css代码中的2个类名连一起写是啥意思?
<div class="menu-btn closed"> <div class="menu-line"></div> &l ...
- ABAP 删除内表重复数据
SORT <内表> BY <字段> [ascending/descending]. DELETE ADJACENT DUPLICATES FROM <内表> COM ...
- 1.CD冷却效果
CD冷却效果.. 一.将需要用到的图片复制到 PS 中做去色处理,将图片保存为 PNG 格式.如下 二.将制作好的图片导入 Unity 中,做成图集 三.在虚拟按键上添加 UI - Image 制作 ...
- QSlider CSS样式
QSlider::groove:horizontal{ border:0px; height:15px; background:#deffe5; } QSlider::sub-page:horizon ...
- 记一次SpringBoot整合Redis的Bug
SpringBoot整合Redis遇见的坑 <!--Redis配置开始--> <dependency> <groupId>org.springframework.b ...