Layui数据表格动态加载操作按钮
效果:
方法一:绑定模版选择器
<div class="layui-card">
<div class="layui-card-body layui-row layui-col-space10">
<table class="layui-hide" id="deliveryTable" lay-filter="deliveryTable"></table>
<script type="text/html" id="delivery-table-operate">
<a class="layui-btn layui-btn-xs" lay-event="edit">备注</a>
{{# if(d.EnclosureUrl != ''){ }}
<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="download">下载简历</a>
{{# } }}
</script>
</div>
</div>
table.render({
elem: '',
id: '',
height: '',
url: '', //数据接口,
method: 'post',
defaultToolbar: ['filter', 'exports', 'print'],
toolbar: false,
page: {
limit: 10,
limits: [10, 20, 30]
},
parseData: function (res) { //res 即为原始返回的数据 },
cols: [[
{ align: 'center', title: '操作', width: 180, toolbar: '#delivery-table-operate' }
]]
});
方法二:函数转义( layui 2.2.5及以上)
table.render({
elem: '',
id: '',
height: '',
url: '', //数据接口,
method: 'post',
defaultToolbar: ['filter', 'exports', 'print'],
toolbar: false,
page: {
limit: 10,
limits: [10, 20, 30]
},
parseData: function (res) { //res 即为原始返回的数据 },
cols: [[
{ align: 'center', title: '操作', width: 180, templet: OnloadTool }
]]
});
function OnloadTool(data) {
let htmls = '<a class="layui-btn layui-btn-xs" lay-event="edit">备注</a>';
if (data.EnclosureUrl != '') {
htmls += '<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="download">下载简历</a>';
}
return htmls;
}
官方文档:https://www.layui.com/doc/modules/table.html#templet
Layui数据表格动态加载操作按钮的更多相关文章
- layui数据表格分页加载动画,自己定义加载动画,"加载中..."
记录思路,仅供参考 在表格渲染完成后,在done回调函数中给分页动态加点击事件, 关闭"加载中..."动画也是在 done回调函数中关闭 这是我实现的思路,记录给大家参考. , d ...
- 如何在在WinFrom的DataGridView中做到数据持续动态加载而不卡死
1.在这个过程我用过好几种办法 (1)使用委托的办法,这个方法可以做到持续加载,但是效果不理想会卡死 (2)开启线程的方法,会造成卡死 (3)使用另一个窗体的线程做持续加载(子窗体),让子窗体作为一个 ...
- Lodop 动态加载模板,动态加载数据
最近需要使用Lodop打印控件,所以就研究了一下,期间从网上找了诸多的东西,基本全是对HTML进行打印的,没有找到我想要的,就只好自己动手丰衣足食. 这篇文章主要讲述的是Lodop与数据的结合使用,官 ...
- 动态加载DataGrid表头及数据
初始化表头 js生成前端 /*初始化表头*/ function initDataGridTitle(id) { $.ajax({ url: '/${appName}/report/***/***', ...
- Echarts使用及动态加载图表数据 折线图X轴数据动态加载
Echarts简介 echarts,缩写来自Enterprise Charts,商业级数据图表,一个纯JavaScript的图表库,来自百度...我想应该够简洁了 使用Echarts 目前,就官网的文 ...
- 爬虫:获取动态加载数据(selenium)(某站)
如果网站数据是动态加载,需要不停往下拉进度条才能显示数据,用selenium模拟浏览器下拉进度条可以实现动态数据的抓取. 本文希望找到某乎某话题下讨论较多的问题,以此再寻找每一问题涉及的话题关键词(侵 ...
- 会员管理系统的设计和开发(2)-- RDLC报表的设计及动态加载
在上篇<会员管理系统的设计和开发(1)>介绍了关于会员系统的一些总体设计思路和要点,经过一段时间开发,软件终于完成并发布.在这期间,碰到了不少技术难点,并积累了不少开发心得和经验,本篇继续 ...
- Ajax动态加载数据
前言: 1.这个随笔实现了一个Ajax动态加载的例子. 2.使用.net 的MVC框架实现. 3.这个例子重点在前后台交互,其它略写. 开始: 1.控制器ActionResult代码(用于显示页面) ...
- MiniUI treeGrid 动态加载数据与静态加载数据的区别
说明:treegrid静态数据加载时数据结构是一棵树包含children节点集合,而采用动态加载数据时数据是List结构的具体项. 静态加载数据 test1.html <!DOCTYPE htm ...
随机推荐
- JVM性能优化 (一) 初识JVM
一.我们为什么要对JVM做优化 在本地开发环境中我们很少会遇到需要对JVM进行优化的需求,但是到了生产环境,我们可能会有下面的需求: 运行的应用"卡住了",日志不输出,程序没有反应 ...
- 3、react-props/state
1.react中属性props和状态state 属性--静态得,所以在初始化得时候使用得是static进行初始化得,正常情况下属性不改 状态--动态得,它得值是可以发生改变得,react中的组件更新( ...
- 【JUC系列】01、之大话并发
学习方法 学习技术的方法都很类似,大部分都有着类似的步骤: 场景 需求 解决方案 应用 原理 并发的目的 充分利用CPU 和 I/O资源 提高效率 并发的维度 分工 同步/协作 互斥 分工 线程池 f ...
- jreble备注
版本:2019.1.4 激活URL:http://jrebel.pyjuan.com/36931214-7bb6-42d4-afd7-26eb5628e004
- 解决intellij idea卡顿的方法
使用idea越用越卡,即使是16G内存也是卡,多开几个微服务卡死了!! 解决方案 参考网路资源整理如下几条 1. 卸载不需要用的插件 我是Java开发,对于一些默认安装的什么安卓的google的app ...
- 2.Go--hello world
编写一个hello world package main import ( "fmt" "time" ) func main(){ fmt.Println(&q ...
- [转] 使用diskpart命令修复U盘分区
点击阅读原文 前段时间在论坛上讨论封装PE到u盘里热闹的,就想自己也封装一个,随便下载了一个WIN7的PE封装后发现还不错,本来就是做测试用的,测试完了就想把u盘在恢复成以前的样子,可是发现恢复并不是 ...
- vc6.0的项目如何在整个项目中查询内容呢?试试vs2015
vc6.0的项目如何在整个项目中查询内容呢?试试vs2015 https://blog.csdn.net/txwtech/article/details/101308795
- fork,vfork和clone底层实现
分类: LINUX2011-10-13 09:33 1116人阅读 评论(0) 收藏 举报 structdstsignalthreadnulldomain fork,vfork,clone都是linu ...
- hystrix信号量和线程池的区别