《 mysiteforme 》 学习之layui table 的使用

1、引入 js

<script type="text/javascript" src="${base}/static/layui/layui.js"></script>
<script type="text/javascript" src="${base}/static/js/tools.js"></script>

2、table 的设置

<script>
    layui.use(['layer','form','table'], function() {
        var layer = layui.layer,
                $ = layui.jquery,
                form = layui.form,
                table = layui.table,
                t,changeIndex;                  //表格数据变量

        t = {
            elem: '#test',
            url:'${base}/admin/system/dict/list',
            method:'post',
            page: { //支持传入 laypage 组件的所有参数(某些参数除外,如:jump/elem) - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'], //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                groups: 2, //只显示 1 个连续页码
                first: "首页", //显示首页
                last: "尾页", //显示尾页
                limits:[3,10, 20, 30]
            },
            width: $(parent.window).width()-223,
            cols: [[
                {type:'checkbox'},
                {field:'type',      title: '类型'},
                {field:'label',     title: '标签'},
                {field:'value',     title: '值'},
                {field:'description',    title: '描述'},
                {field:'createDate',  title: '创建时间',width:'15%',templet:'<div>{{ layui.laytpl.toDateString(d.createDate) }}</div>',unresize: true}, //单元格内容水平居中
                {fixed: 'right', title: '操作',   width: '30%', align: 'center',toolbar: '#barDemo'}
            ]]
        };

3、bean 的定义

public class LayerData<T> {
    private Integer code = 0;
    private Integer count;
    private List<T> data;
    private String msg = "";

猜你喜欢

转载自www.cnblogs.com/lyon91/p/9008231.html
今日推荐