layUI数据表格(table)

简介: layUI数据表格(table)
<!--引入 layui.css--> 
//定义表格
<table class="layui-table" lay-data="{id:'myTableID'}">
  <thead>
    <tr> 
      <th lay-data="{type:'checkbox'}"></th> // --->加上选择框会显示行号
      <th lay-data="{field:'id', width:80,hide:true}">隐藏ID</th>
      <th lay-data="{field:'username', width:80}" rowspan="2">联系人</th>
      <th lay-data="{field:'amount', width:120}" rowspan="2">金额</th>
      <th lay-data="{align:'center'}" colspan="3">地址</th>
    </tr>
    <tr>
      <th lay-data="{field:'province', width:80}">省</th>
      <th lay-data="{field:'city', width:120}">市</th>
      <th lay-data="{field:'county', width:300,templet:'<div>{{myFun(d.county)}}</div>'}">详细</th>  //-->数据格式化
    </tr>
  </thead>
</table>
<!--引入 jquery.js--> 
<!--引入 layui.js-->
//自定义函数
function myFun(o){
    // do.....
}
//加载数据 刷新表格
table.reload('myTableID', {
    url: _ctx + '/url',
    where: { //参数设置
        aaaaaa: 'xxx'
        ,bbb: 'yyy'
        //…
    }
    ,page: {
        curr: 1 //从第 1 页开始显示
    }
});
相关文章
|
6月前
|
JavaScript Java 数据格式
Layui数据表格(table)前后台交互
Layui数据表格(table)前后台交互
221 0
|
6月前
|
JavaScript
Layui数据表格嵌套文件上传按钮
Layui数据表格嵌套文件上传按钮
122 0
|
6月前
layUI数据表格可编辑扩展下拉框
layUI数据表格可编辑扩展下拉框
|
6月前
|
数据格式
layui数据表格
layui数据表格
19 0
|
6月前
layui数据表格格式化
layui数据表格格式化
|
6月前
element Table表格隐藏列
element Table表格隐藏列
113 0
|
9月前
vue-mergeable-table 动态生成的可合并行列的表格
vue-mergeable-table 动态生成的可合并行列的表格
90 0
|
数据格式
Layui数据表格templet的数据无法合计
在使用layui数据表格的时候,有一个列是使用templet,依据其他两个列数据计算得到。 在该列开启合计行,一直显示是0 。其他两列数据合计正常。 在社区和百度上寻找过答案,并没有相关介绍。 在解决了该问题后,写下这篇小记录。
292 0
|
11月前
|
前端开发 JavaScript 开发工具
前端|layui后台管理—table 数据表格
前端|layui后台管理—table 数据表格
341 0
|
12月前
layui不同 li 不同数据表格,当前数据表格刷新后原定位到之前的 li
layui不同 li 不同数据表格,当前数据表格刷新后原定位到之前的 li