layui加載數據

最近項目重構 ， 之前用的是jui， 發現不是很理想 ， 想來想去 ，還是用了layui ， 之前沒接觸過layui ， 一切從0開始 。

首先加載的是table

 

    <table id="demo" lay-filter="test"></table>

    <script src="~/layui-v2.2.45/layui/layui.js"></script>
    <script>
        layui.use('table', function () {
            var table = layui.table;

            //第一個實例
            table.render({
                elem: '#demo'
                , scrollbar: true
              , url: 'xxxx' //數據url
              , page: true //開啟分頁
               , edit: true
              , cols: [[ //表頭
                     { field: 'StationCode', title: 'xxxx', width: "12%", fixed: 'left' }
              
              ]]

            });

 

 這些代碼文檔里面都有  很容易找到  注意一點  接口返回的數據格式是固定的  這個一開始不知道  后來還是花了點時間才弄清楚  

   public JsonResult Table(object data, int count, string msg = "成功")
        {
            return Json(new { code = 0, msg = msg, count = count, data = data });//返回的數據格式  固定的  
        }

 

然后你就會發現數據出來了  ，

 

layui這個畫面風格很不錯 ，賞心悅目的， 值得多用