html代碼：

<!-- 引入 layui.css -->
<link href="static/css/layui.css" rel="stylesheet">
 
<!-- 引入 layui.js -->
<script src="static/js/layui.js"></script>
 
<table class="layui-hide"  id="demo"></table>
<script>
    layui.use('table', function () {
        var table = layui.table;
        table.render({
            elem: '#demo'//對應着Table的ID
            , method: 'get'
            , toolbar: 'default'
            , url: '/Demo/GetJson2'//URL爲數據接口的地(dì)址
            , request: {  //自(zì)定義 page  limit
                pageName: 'pageNo',    //頁碼的參數名稱，默認：page
                limitName: 'pageSize'  //每頁數據量的參數名，默認：limit
            }
            , parseData: function (res) {
                return {
                    "code": 0,//數據類型,必須的
                    "count": res.count,//總記錄數,用于分(fēn)頁
                    "data": res.data,//必須的
                }
            }
            , cellMinWidth: 80 //全局定義常規單元格的最小(xiǎo)寬度，layui 2.2.1 新增
            , cols: [[
                { field: 'id', title: '編号', width: 80, sort: true }
                , { field: 'name', title: '姓名', width: 100, sort: true }
                , { field: 'age', title: '年齡', width: 80, sort: true}
                , { field: 'sex', title: '性别', width: 80, sort: true }
            ]],
            limits: [15, 30, 50, 100],
            limit: 15,
            page: true,
        });
    });
</script>

生成模拟數據：

//模拟生成一個JSON
public ActionResult GetJson2(int pageNo, int pageSize)
{
            Random ra = new Random();//随機數
            int count = pageSize * 10;//總記錄數
 
            string json = "";
            json += "{";
            json += "\"count\":" + count + ",";
 
            string data = "\"data\":[";
            for (int i = ((pageNo - 1) * pageSize); i < (pageNo * pageSize); i++)
            {
                if (data == "\"data\":[")
                {
                    data += "{\"id\":" + (i + 1) + ",\"name\":\"姓名_" + (i + 1).ToString() + "\",\"age\":" + ra.Next(10, 30) + ",\"sex\":\"" + ((i % 3 == 0) ? "女(nǚ)" : "男(nán)") + "\"}";
                }
                else
                {
                    data += ",{\"id\":" + (i + 1) + ",\"name\":\"姓名_" + (i + 1).ToString() + "\",\"age\":" + ra.Next(10, 30) + ",\"sex\":\"" + ((i % 3 == 0) ? "女(nǚ)" : "男(nán)") + "\"}";
                }
            }
            json += data + "]";
 
            json += "}";
 
            return Content(json);
}

生成的Json數據

{"count":150,"data":[{"id":1,"name":"姓名_1","age":10,"sex":"女(nǚ)"},{"id":2,"name":"姓名_2","age":20,"sex":"男(nán)"},{"id":3,"name":"姓名_3","age":20,"sex":"男(nán)"},{"id":4,"name":"姓名_4","age":17,"sex":"女(nǚ)"},{"id":5,"name":"姓名_5","age":14,"sex":"男(nán)"},{"id":6,"name":"姓名_6","age":12,"sex":"男(nán)"},{"id":7,"name":"姓名_7","age":16,"sex":"女(nǚ)"},{"id":8,"name":"姓名_8","age":14,"sex":"男(nán)"},{"id":9,"name":"姓名_9","age":14,"sex":"男(nán)"},{"id":10,"name":"姓名_10","age":13,"sex":"女(nǚ)"},{"id":11,"name":"姓名_11","age":13,"sex":"男(nán)"},{"id":12,"name":"姓名_12","age":25,"sex":"男(nán)"},{"id":13,"name":"姓名_13","age":28,"sex":"女(nǚ)"},{"id":14,"name":"姓名_14","age":22,"sex":"男(nán)"},{"id":15,"name":"姓名_15","age":28,"sex":"男(nán)"}]}

效果預覽:

簡單說明:

開(kāi)啓分(fēn)頁功能:  page: true,

當前每頁記錄數: limit: 15,

記錄數可(kě)選的集合: limits: [15, 30, 50, 100],

從(cóng)layui傳遞給mvc的分(fēn)頁參數: request: { pageName: 'pageNo', limitName: 'pageSize' }

在mvc接收layui傳來(lái)分(fēn)頁參數: public ActionResult GetJson2(int pageNo, int pageSize)

layui接收mvc傳來(lái)的值: 

parseData: function (res) {               

return {

        "code": 0,//數據類型,必須的

        "count": res.count,//總記錄數,用于分(fēn)頁

        "data": res.data,//必須的

    }

}

layui2.7.6