欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

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

程序员文章站 2022-03-01 13:31:50
```javascript//表格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 =....

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