layui table 詳細講解


 layui.use('table', function () {
            var table = layui.table;
            /*第一種原始寫法*/
            /*
            table.render({
                id: 'laydictsList',
                elem: '#test',
                url: areasURL + "/base_dics/LayuigetPageList",
                cellMinWidth: 80,//全局定義常規單元格的最小寬度,layui 2.2.1 新增
                where: { txtFullName: null },
                page: true,
                //toolbar:'barDemo',
                limit: 10,
                limits: [2, 5, 10, 20, 30],
                text: {
                    none: '暫無相關數據!'//默認無數據
                },
                cols: [[
                  { type: 'checkbox', LAY_CHECKED: false },
                  { field: 'dicsid', width: 80, title: 'ID', sort: true, hide: true },
                  { field: 'code', width: 80, title: '編號' },
                  { field: 'sortnum', width: 80, title: '序號', sort: true },
                  { field: 'fullname', width: 80, title: '名稱' },
                  { field: 'diccategoryname', title: '所屬類別', width: '30%', minWidth: 100 }, //minWidth:局部定義當前單元格的最小寬度,layui 2.2.1 新增
                  { field: 'experience', title: '操作' }
                ]]
            });
        });
        */
            /*第二種改進版*/
            table.render({
                id: 'laydictsList',
                elem: '#test',
                url: areasURL + "/base_dics/getPageList",
                method: "post",
                request: {
                    pageName: 'PageNum', //頁碼的參數名稱,默認:page
                    limitName: 'PageSize' //每頁數據量的參數名,默認:limit
                },
                response: {
                    statusName: 'ReturnType', //數據狀態的字段名稱,默認:code
                    statusCode: true,//成功的狀態碼,默認:0
                    msgName: 'ReturnMsg', //狀態信息的字段名稱,默認:msg
                    countName: 'ReturnCount', //數據總數的字段名稱,默認:count
                    dataName: 'ReturnData', //數據列表的字段名稱,默認:data
                },
                cellMinWidth: 80,//全局定義常規單元格的最小寬度,layui 2.2.1 新增
                where: { txtFullName: null },
                page: true,
                //toolbar:'barDemo',
                limit: 10,
                limits: [2, 5, 10, 20, 30],
                text: {
                    none: '暫無相關數據!'//默認無數據
                },
                cols: [[
                  { type: 'checkbox', LAY_CHECKED: false },
                  { field: 'dicsid', width: 80, title: 'ID', sort: true, hide: true },
                  { field: 'code', width: 80, title: '編號' },
                  { field: 'sortnum', width: 80, title: '序號', sort: true },
                  { field: 'fullname', width: 80, title: '名稱' },
                  { field: 'diccategoryname', title: '所屬類別', width: '30%', minWidth: 100 }, //minWidth:局部定義當前單元格的最小寬度,layui 2.2.1 新增
                  { field: 'experience', title: '操作' }
                ]]
            });
        });


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM