wip:Tabulator

6046 ワード
memo memo テキストリンク

リンク（固定）

$("#example").tabulator({
    height: "311px",
    columns: [
        {title: "", headerSort: false, formatter: "link", formatterParams: {label: "リンク", url: "/"}},
    ]
});

リンク（カスタマイズ）

$("#example").tabulator({
    height: "311px",
    columns: [
        {title: "", field: "name", headerSort: false, formatter: "link",
         formatterParams: {label: "リンク", url:
                        function(cell){
                            return "link?v=" + cell.getValue()}}},
    ],
});

テーブルにセットされた値(name）を取得してリンク先のパラメータ(v)に設定している
（TODO：リンク先は安全な値になるように気をつけて・・・）

フィルター（カスタム）

テーブルに表示する値をフィルタリング

function customFilter(data, filterParams){
    //data - the data for the row being filtered
    //filterParams - params object passed to the filter

    return data.name == "bob" && data.height < filterParams.height; //must return a boolean, true if it passes the filter.
}

$("#example-table").tabulator("setFilter", customFilter, {height:3});

（公式ドキュメントの例をそのまま引用）

読み込み中のメッセージを書き換える

$("#example").tabulator({
ajaxLoaderLoading: "読み込み中",
....
})