LoginSignup
1
0

More than 5 years have passed since last update.

wip:Tabulator

Last updated at Posted at 2018-03-18

リンク(固定)

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

スクリーンショット 2018-03-18 9.16.06.png

リンク(カスタマイズ)

$("#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: "読み込み中",
....
})
1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0