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

html:

"demo" lay-filter="test">
//表格
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 //每页默认显示的数量
    });
*/
});

你可能感兴趣的:(前端开发,javascript,html,LayUI)