layui

在监听select选择的方法中： 补充一下 给select添加自定义属性 同样在监听方法中： $(data.elem).find("option:selected").attr("属性名","值")； 来源： oschina 链接： https://my.oschina.net/u/3917458/blog/4303914

1、layui2.2.6，在谷歌浏览器58.0版本下，使用layui.table.checkStatus('tableId')无法获取选中行的数据。 2、解决方法： 定义一个全局变量tableData，在table.render({})方法中添加 done: function(res, curr, count){ tableData = res.result;//返回结果封装的数据集 },接着遍历复选框列，(复选框外层样式 laytable-cell-checkbox和内层选中样式layui-form-checked需要根据实际情况确认，不同版本可能有不同 )： $('. laytable-cell-checkbox ' ).each(function(i,item)){ //item对象中有两个元素，一个是checkbox，一个是包含选中与否的样式的div if($(item).find('. layui-form-checked ').length>0){ //该行是选中状态，根据索引i到tableData数组中找相应行的数据 } } 来源： oschina 链接： https://my.oschina.net/u/161393/blog/4290872

1、想要实现一个自由组合查询条件的功能，给不会写SQL语句的人使用。比如生成的查询条件树如下图： 它表达的查询条件是：( 1=1 AND ATTACK_TIMES > 8 OR ( ATTACK_SOURCE = 外网 AND ATTACK_TYPE = SHELL脚本 ) ) 2、分析这个需求，核心是父节点和其子节点要作为一个整体条件： （1）根节点的默认条件是1=1，如果没有子节点，查询条件就是1=1； （2）在根节点下添加一个节点：AND 攻击次数 大于8,查询条件变为：1=1 and attack_times>8;(节点的数据包括哪些属性，后边再说) （3）在根节点下再增加一个节点：OR 攻击来源 等于外网，查询条件变为：1=1 and attck_times>8 or attack_src='外网'； （4）在OR 攻击来源 等于外网这个节点下添加一个节点：AND攻击类型 等于SHELL脚本，则OR这节点的整体条件为：or( attack_src='外网' and attack_type='SHELL脚本'），整棵树表示的条件是：( 1=1 AND ATTACK_TIMES > 8 OR ( ATTACK_SOURCE = 外网 AND ATTACK_TYPE = SHELL脚本 ) ) 3、因为节点可以无限添加，则可以据此构造任何查询条件。下面说一下节点数据的结构，

layui之layer打开table后分页无效的解决方法 参考文章： （1）layui之layer打开table后分页无效的解决方法 （2）https://www.cnblogs.com/g177w/p/10286511.html 备忘一下。 来源： oschina 链接： https://my.oschina.net/u/4264342/blog/4336829

具体开发中遇到的问题如下， 数据表格内的 内容 通过 table.cache["SampleList"] 修改后，重新渲染或重新加载会导致当前操作的分页 和 配置被清空。我修改了第5页第X行的X列值，重新渲染后就回到了最原始第1页或重新调用了接口。 Layui 官方提供的文档 提供的刷新表格方法有几种 1 var obj = table.render({}); // 生成一个数据表格 1.obj.Reload (这个方法会根据初始化表格的Option {} ,重新调用接口加载一次) 2.Table.Render(这个无效果) ---------------------------------------------------- ---------------------------------------------------- ---------------------------------------------------- ---------------------------------------------------- 需要达到的效果是： 不调用接口，仅仅只是从table.cache["表ID"] 当前页缓存里重新渲染， 步骤： 1.将需要修改的列 值 使用table.cache["表ID"][“行索引”]["字段名"]=“xxxx” 进行修改 2

　 　好记性不如烂笔头。本来就是没什么好记得东西，下次再用时已经想不起来了。　　 问题如下 　　　 　　🐟使用layui表格，表格字段显示不全，如果超出分配的位置，就会显示省略号（如上图），当鼠标放上是可以展开查看全部内容。对于备注等不重要字段这确实是一个不错的方式，但是对于一些单号状态，显示不全就会让人很难受。　　 问题分析 　　①我首先想通过样式来让表体内容根据内容大小自动适应宽度，根据内容改变宽度，最后得到效果如下 .layui-table-cell { 　　 width : auto ; } 　　 　　🐟得到的结果，表格的单元格根据表格的内容撑大了，同时也导致了 表头和表体不对齐 了，因为表格框架都是 表头和表体采用的是两个表格 来做的，所以就会出现这样情况。 　　😚为什么表头与表体要用两个表格来做呢？ 　　　　来自闪存回答：为了 实现复杂多级表头 （所以也就是很多表格框架可能出现表头与表体对不上的原因） 　　 🐟所以我们该如何让表头和表体对齐呢？ 　　　　让表头和表体使用 同一种模式去计算宽度 。也就是定义好宽度，在生成表格的时候都使用这个宽度。 layui做法 情况一：字段比较少未超出屏幕时 　　为了显示美观，这种情况下一般会根据屏幕大小平分到每个单元格上 情况二：超出一屏幕 　　这是layui字段中可以定义宽度，如果没有定义宽度系统layui有一个默认显示宽度

嗨，你知道吗 Niushop单商户商城系统V4上线啦！ 价值百万元商业授权好礼大放送活动 正在火热进行中…… 技术亮点 1.框架采用全新thinkphp6+事件开发设计+layui+uniapp进行设计，代码完全重构，采用支持百万级！ 2.前端以layui + uniapp模块化开发； 3.数据导出采用phpExcel，使数据更加直观，更方便于管理统计； 4.插件钩子机制，功能模块独立，更有助于二次开发； 5.后台采用ECharts，直观体现关系数据可视化的图，支持图与图之间的混搭。实现完善的数据统计和分析； 6.EasyWeChat部署微信开发，微信接入更加快捷、简单； 7.内置强大灵活的权限管理体系，有利于专人专项运营； 8.内置组合数据统计，系统配置，管理碎片化数据统计； 9.客户端完善的交互效果和动画，提升用户端视觉体验； 10.可以完美对接公众号和小程序，并且数据同步，实现真正意义上的一端开发，多端使用； 11.内置客服系统，可以对接微信客服,客服在线实时聊天； 12.高频数据缓存,数据库读写分离，很大程度减轻服务器压力，提升访问速度； 13.后台设置菜单中可以一键数据备份和恢复，完全傻瓜式操作就可以轻松升级备份； 14.在线一键升级，轻松跨越到最新版本； 15.标准Api接口、前后端分离，二次开发更方便快捷； 16.支持数据库结构、数据、模板在线缓存清除，提升用户体验；

layui上传图片控件 //上传图片 upload.render({ elem: '#upload_pic', url: '../file/uploadImage.do', size: 30720, //限制文件大小，单位 KB field: 'file', exts: 'jpg|gif|png|jpeg', done: function (res) { if (res.code == 0) { layer.msg("上传成功"); } else { layer.msg(res.msg); } } }); 选择不是上传限制的图片类型,因为增加了富文本框ueditor和form嵌入造成提示框 “选择的图片中包含不支持的格式” 偏下解决办法 修改 layui下 upload.js中提示框源码 文件路径：layui -> lay -> modules -> upload.js 修改内容：o.msg("选择的图片中包含不支持的格式"); 更改为 -> parent.layer.msg("选择的图片中包含不支持的格式"); 来源： oschina 链接： https://my.oschina.net/u/3204029/blog/4292212

关于layui 三级联动 渲染报错解决方法 参考文章： （1）关于layui 三级联动 渲染报错解决方法 （2）https://www.cnblogs.com/enych/p/9285451.html 备忘一下。 来源： oschina 链接： https://my.oschina.net/u/4303145/blog/4477131

2020.1.16 最近终于又用到了导出表格，我在实际项目里使用了上次发现的导出全部数据方法，然后遇到了一些问题，并进行了解决，终于可以正式写在博客中了。 整体代码： < div style ="display: none" > < table id ="table" > </ table > </ div > // 导出表格配置 table.render({ elem: '#table' , id: 'exportTable' , title: '导出的文件名' , cols: [[ // 表头 { field: 'uid' , title: 'ID' , }, { field: 'uname' , title: '姓名' , } ]] }); // 导出事件 $('#export').on('click', function () { // 使用ajax请求获取所有数据 $.ajax({ url: "url" , type: 'post' , data: { type: 1 }, async: false , dataType: 'json' , success: function (res) { // 使用table.exportFile()导出数据 table.exportFile('exportTable', res.data, 'xls' ); } }); });