Datatables跳轉到指定頁


因為項目用到Datatables發現在分頁特別多時無法跳轉到指定頁,自己動手增加了#Datatables 跳轉到指定頁#功能,實現代碼如下:

table = $('#user-table').dataTable({
    "bAutoWidth": false,
    "processing": true,
    "serverSide": true,
    "bStateSave":true,
    "pagingType": "full_numbers",
    "order": [[0, 'asc']],
    "ajax": get_users,
    "oLanguage": {
        "sUrl": "/js/advanced-datatable/lang/Chinese.json"
    },
    "drawCallback": function( settings ) {
        if ($('body').height() < document.documentElement.clientHeight) {
            $('footer').css('position','fixed');
        } else {
            $('footer').css('position','static');
        }
        if ( sla_type == 1) {
            table.api().column(4).visible(false);
        } else {
            table.api().column(4).visible(true); 
        }
// 核心實現:不能放到initComplete方法里,因為表格重載后跳轉功能會消失
if (table.api().page.info().pages > 1) { $("#dynamic-table_info").append('<div class="jump-page">跳到 <input type="number" id="jump_page" min="1"> 頁</div>'); } }, "initComplete": function(settings, json) { if ($('body').height() < document.documentElement.clientHeight) { $('footer').css('position','fixed'); } else { $('footer').css('position','static'); } $('.adv-table input[type="search"]').addClass('form-control'); }, "rowCallback": function(row, data) { $('td:eq(0)', row).attr('title', '角色權限:' + data[11]); }, }); // datatables跳轉到指定頁 $("body").delegate('#jump_page', 'keyup', function(event) { var page = Number($(this).val()); if (event.keyCode == 13 && page > 0) { table.api().page(page - 1).draw(false); } });

 


免責聲明!

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



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