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相关问题总结的更多相关文章

  1. layui相关总结

    表格操作实例1: https://sun_zoro.gitee.io/layuitableplug/testTableCheckboxDisabled?v0.1.9

  2. layui相关用法总结

    1.关闭当前弹出层 parent.layer.close(parent.layer.getFrameIndex(window.name));

  3. Layui的一点小理解(上)

    首先声明这是个人的一点理解,如有不对之处请指正,以下的例子有在官网上看到的,有的是自己写的.还是老规矩最后会附上官网的,如有不明白之处,请查看文档或留言. 既然说Layui,当然要简单的介绍以下什么是 ...

  4. asp.net core封装layui组件示例分享

    用什么封装?自然是TagHelper啊,是啥?自己瞅文档去 在学习使用TagHelper的时候,最希望的就是能有个Demo能够让自己作为参考 怎么去封装一个组件? 不同的情况怎么去实现? 有没有更好更 ...

  5. .net mvc + layui做图片上传(二)—— 使用流上传和下载图片

    摘要:上篇文章写到一种上传图片的方法,其中提到那种方法的局限性,就是上传的文件只能保存在本项目目录下,在其他目录中访问不到该文件.这与浏览器的安全性机制有关,浏览器不允许用户用任意的路径访问服务器上的 ...

  6. layui学习<一>

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...

  7. layui弹出层之应用实例讲解

    从酒店管理系统到智能门锁及其现在的资源共享平台,layui框架,我们团队用的比较多的就是这个layui弹出层. layui弹出层,除了页面iframe层我们比较常用还有就是表单校验和其他相关的友好提示 ...

  8. layui表格的新增和编辑功能前端代码

    html页面的代码(注意:引入layui相关的css): <div class="layui-form-item"> <label class="lay ...

  9. layui的多文件列表上传功能前端代码

    html页面的代码(注意:引入layui相关的css): <div class="layui-upload" style="margin-left: 130px&q ...

  10. .Net之Layui多图片上传

    前言: 多图上传在一些特殊的需求中我们经常会遇到,其实多图上传的原理大家都有各自的见解.对于Layui多图上传和我之前所说的通过js获取文本框中的文件数组遍历提交的原理一样,只不过是Layui中的up ...

随机推荐

  1. postgresql添加系统表报错

    1.添加系统表后,执行make install报如下错误,未自动生成下面两个文件cp: cannot stat './catalog/ux_user_status_d_compatible.h': N ...

  2. vue2的响应式原理

    响应式的话,主要指的是这个状态改变以后,视图要去主动更新 这个过程,vue是通过两个步骤来实现的 1 数据的劫持 数据劫持也叫做数据拦截,通过Object.defineProperty来把对象中的每一 ...

  3. source 跳过登录账号的方法

    1 安装 git windows 选择版本为 Git-2.29.2.2-64-bit 2 启动sourcetree 的安装 选择版本为 SourceTreeSetup-2.5.5 2.1 第一次启动 ...

  4. matlab画图之plot画折线图

    Matlab绘制折线图 使用plot(x,y)函数创建折线图时,x,y有以下要求: ①如果 X 和 Y 都是向量,则它们的长度必须相同.plot 函数绘制 Y 对 X 的图. ②如果 X 和 Y 均为 ...

  5. css 多行隐藏

    overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box- ...

  6. css代码中的2个类名连一起写是啥意思?

    <div class="menu-btn closed"> <div class="menu-line"></div> &l ...

  7. ABAP 删除内表重复数据

    SORT <内表> BY <字段> [ascending/descending]. DELETE ADJACENT DUPLICATES FROM <内表> COM ...

  8. 1.CD冷却效果

    CD冷却效果.. 一.将需要用到的图片复制到 PS 中做去色处理,将图片保存为 PNG 格式.如下 二.将制作好的图片导入 Unity 中,做成图集 三.在虚拟按键上添加 UI - Image 制作 ...

  9. QSlider CSS样式

    QSlider::groove:horizontal{ border:0px; height:15px; background:#deffe5; } QSlider::sub-page:horizon ...

  10. 记一次SpringBoot整合Redis的Bug

    SpringBoot整合Redis遇见的坑 <!--Redis配置开始--> <dependency> <groupId>org.springframework.b ...