当前位置: 移动技术网 > IT编程>开发语言>JavaScript > layui.table动态获取表头和列表数据示例

layui.table动态获取表头和列表数据示例

2020年07月14日  | 移动技术网IT编程  | 我要评论

html:

<table id="demo" lay-filter="test"></table>
//表格
layui.use('table', function() {
    var table = layui.table;
    var cols = [], data = [];

    $.ajax({url:"/index.php?c=Api&a=getProductByCategory&cid={$data[0][classid]}", async: false, success:function(re){
        data = re.data;
        cols = re.cols;
    }});

    table.render({
        elem: '#demo'
        ,cols: [cols]
        ,data: data
    });

/*
    table.render({
        elem: '#demo'
        ,cols: [cols]
        ,url: '/index.php'
        ,method: 'get'
        ,where: {c:'Api',a:'getProductByCategory',cid:'{$data[0][classid]}'}
        ,request: {
          pageName: 'page' //页码的参数名称,默认:page
          ,limitName: '9999' //每页数据量的参数名,默认:limit
        }
        ,parseData: function(res){ //res 即为原始返回的数据
          return {
            "code": res.code, //解析接口状态
            "msg": res.msg, //解析提示文本
            "count": res.count, //解析数据长度
            "cols": res.cols, //cols
            "data": res.data //解析数据列表
          };
        }
        
        //,page: true //是否显示分页
        //,limits: [5, 7, 10]
        //,limit: 5 //每页默认显示的数量
    });
*/
});

本文地址:https://blog.csdn.net/chenxiong103/article/details/107290133

如对本文有疑问, 点击进行留言回复!!

相关文章:

验证码:
移动技术网