web-dev-qa-db-ja.com

DataTablesはページ付けボタンの数を変更します

デフォルトでは、DataTablesプラグインは7つのページングボタン（省略記号を含む）を表示します

Previous12345...10Next

これを次のような小さい数に変更できるようにしたい

Previous1...10Next

そして、私はこれをドキュメントのどこにも見つけることができません。

私は this plugin を見つけましたが、deprecatedであり、

DataTables 1.10にはこの機能が組み込まれています。

ただし、これを変更する場所は示されていません。

jquerypaginationdatatables
17
Iulian Onofrei

DataTable javascriptオブジェクトとDataTables 'ソースコードをいじってみて、ようやく見つかりました。

この行を追加する必要があります（初期化の前または後）：

$.fn.DataTable.ext.pager.numbers_length = 3;

注これは次のように表示されます

Previous1...10Next

ではなく

Previous12...10Next

したがって、必ずinclude長さ番号の省略記号を使用してください。

編集：

ページを進めていくと、このソリューションにいくつかの問題がありました。

私は彼らを書き直さなければならなかった_numbersこのような関数：

function _numbers(page, pages) {
    var
        numbers = [],
        buttons = 5, // added here the number of buttons
        half = Math.floor(buttons / 2);

    if(pages <= buttons) {
        numbers = _range(0, pages);
    } else if(page <= half) {
        numbers = _range(0, buttons - 2);

        numbers.Push("Ellipsis");
        numbers.Push(pages - 1);
    } else if(page >= pages - 1 - half) {
        numbers = _range(pages - (buttons - 2), pages);

        numbers.splice(0, 0, "Ellipsis");
        numbers.splice(0, 0, 0);
    } else {
        numbers.Push(page); // changed this from _range(page - 1, page + 2);
        numbers.Push("Ellipsis");
        numbers.Push(pages - 1);
        numbers.splice(0, 0, "Ellipsis");
        numbers.splice(0, 0, 0);
    }

    numbers.DT_el = "span";

    return numbers;
}

そして、これを使用してDataTablesを自分の関数にポイントします：

$.fn.DataTable.ext.pager.simple_numbers = function(page, pages) {
    return ["previous", _numbers(page, pages), "next"];
};

また、_range関数をmy main.jsファイル。

29
Iulian Onofrei

dataTableJSの理想的な最小値は次のとおりです。

$.fn.DataTable.ext.pager.numbers_length = 5;
0
Ruben Hidalgo