jquery.dataTable.js 基礎配置記錄


$("#mainTable").dataTable({
            /* 
             * sErrMode 
             * 錯誤信息顯示方式 
             * 分別為alert和throw,默認為alert 
             */
            "sErrMode": "throw",
            /* 
             * sDom 
             * 布局方式,可以自定義,布局項,也可以調換布局順序 
             * 詳解: 
             * <> 表示一個閉合的div 例如:<> = <div></div> 
             * <"類名稱"> 表示一個class="類名稱"的閉合的div 例如: <"rad"> = <div class="rad"></div> 
             * l  每行顯示的記錄數 
             * f  搜索框 
             * r  加載時的進度條 
             * t  表格,即實際的<table></table> 
             * p  分頁條 
             * i  數據信息,  每頁顯示x條數據、第x條-第x條、供x條數據,默認是英文 
             */
            "sDom": '<lf>rt<lpi><"clear">',
            /* 
             * sServerMethod 
             * 數據獲取方式 
             * POST/GET,默認是GET 
             */
            "sServerMethod": "POST",
            /* 
             * bDeferRender 
             * 是否啟用延遲加載:當你使用AJAX數據源時,可以提升速度。 
             * 默認為false 
             */
            "bDeferRender": true,
            /* 
             * sScrollXInner 
             * 表格寬度 
             */
            "sScrollXInner": "100%",
            /* 
             * bScrollCollapse 
             * 當顯示的數據不足以支撐表格的默認的高度時,依然顯示縱向的滾動條。(默認是false) 
             */
            "bScrollCollapse": false,
            /* 
             * bPaginate 
             * 是否開啟分頁,默認是true 
             */
            "bPaginate": true,
            /* 
             * bLengthChange 
             * 是否允許用戶,在下拉列表自定義選擇分頁大小(10, 25, 50 and 100),需要分頁支持 
             * 默認為true 
             */
            "bLengthChange": false,
            /* 
             * bFilter 
             * 是否啟用內置搜索功能:可以跨列搜索。 
             * 默認為true 
             */
            "bFilter": true,
            /* 
             * bSort 
             * 是否開啟列排序功能,如果想禁用某一列排序,可以在每列設置使用bSortable參數 
             */
            "bSort": true,
            /* 
             * bInfo 
             * 是否顯示表格相關信息:例如翻頁信息等。 
             * 默認值:True  
             */
            "bInfo": true,
            /* 
             * bAutoWidth 
             * 是否啟用自動適應列寬 
             * 默認值:True 
             */
            "bAutoWidth": false,
            /* 
             * bStateSave 
             * 是否開啟cookies保存當前狀態信息 
             * 默認值:false 
             */
            "bStateSave": false,
            /* 
             * sPaginationType 
             * 分頁方式  
             * dataTable提供full_numbers和two_button,默認是two_button 
             * 這里采用的是自定義分頁myPagination,詳細參見jquery.dataTable.custom.js 
             */
            "sPaginationType": "myPagination",
            /* 
             * bProcessing 
             * 是否顯示加載時進度條,默認為false 
             */
            "bProcessing": true,
            /* 
             * iDisplayLength 
             * 默認每頁顯示多少條記錄 
             */
            "iDisplayLength": 10,
            /* 
             * aLengthMenu 
             * 允許用戶選擇每頁顯示多少條記錄 
             */
            "aLengthMenu": [[50, 100, -1], ["50", "100", "所有"]],
            /* 
             * oLanguage 
             * 語言設置,dataTable默認為英文,可再此設置中文顯示 
             * 注意:_MENU_、_START_、_END_、_TOTAL_、_MAX_等通配 
             */
            "oLanguage": {
                "sLengthMenu": "每頁顯示 _MENU_ 條記錄",
                "sZeroRecords": "對不起,沒有匹配的數據",
                "sInfo": "第 _START_ - _END_ 條 / 共 _TOTAL_ 條數據",
                "sInfoEmpty": "沒有匹配的數據",
                "sInfoFiltered": "(數據表中共 _MAX_ 條記錄)",
                "sProcessing": "正在加載中...",
                "sSearch": "全文搜索:",
                "oPaginate": {
                    "sFirst": "第一頁",
                    "sPrevious": " 上一頁 ",
                    "sNext": " 下一頁 ",
                    "sLast": " 最后一頁 "
                }
            },
            /* 
             * aoColumns 
             * 數據列 
             * mData  數據源屬性 
             * sTitle 列頭 
             * bSortable 是否參與排序 
             * mRender 自定義顯示內容,可返回html、字符串 
             */
            "aoColumns": [{
                "mData": 'id',
                "sTitle": "ID",
                "bSortable": true
            }, {
                "mData": 'name',
                "sTitle": "Name",
                "bSortable": true
            }, {
                "mData": 'age',
                "sTitle": "Age",
                "bSortable": true,
                "mRender": function (data, type, row) {
                    return data;
                }
            }, {
                "mData": 'work',
                "sTitle": "Work",
                "bSortable": true
            }],
            /* 
             * fnInitComplete 
             * 表格初始化完成后的回調 
             */
            "fnInitComplete": function () {

            },
            /* 
             * fnDrawCallback 
             * 表格繪制完成后的回調 
             */
            "fnDrawCallback": function () {

            },
            /* 
             * 數據源url,ajax請求路徑 
             */
            "sAjaxSource": "xx/xx/xxx/xxx/xxx"
        });
        

 


免責聲明!

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



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