Tabulator のチェック値のフィルタは、標準ではONを抽出するフィルタである。
サンプル
$('#example-table').tabulator({ layout:"fitDataFill", columns:[ { title:"名前", field:"name", sortable:true, headerFilter:true, headerFilterPlaceholder:"名前フィルタ..." } , { title:"Point", field:"point", align:"right", sortable:true, }, { title:"登録日", field:"rdate", sortable:true, sorter:"date" }, { title:"Active", field:"active", align:"center", formatter: "tickCross", headerFilter: true, width: 80, headerSort: false }, ], }); var tabledata = [ {id:1, name:"あああ", point:12, rdate:"", active: 1 }, {id:2, name:"いいい", point:0, rdate:"1982/05/14", active: 0 }, {id:3, name:"ううう", point:42, rdate:"1982/05/22", active: 1 }, {id:4, name:"ABCDE-1234567890", point:1125, rdate:"1980/04/01", active: 0 }, {id:5, name:"12345", point:16, rdate:"1999/01/31", active: 1 }, ]; $("#example-table").tabulator("setData", tabledata);
チェックをすると、
一般的なユーザインターフェースとしてあり得ないと思うが、
敢えて、OFFのフィルタにしたい場合、
と、したい場合、、どうするか??
行の定義で、headerFilterFunc という属性キーで各行に対する
対象とするか否か、true/false を返す function を設定する。
function customHeaderFilter(headerValue, rowValue, rowData, filterParams){ return trueを返せば対象、 }
この第1引数、the value of the header filter element という説明だが、実際、全て true が入ってくる。
今回のサンプルの場合、4列目の定義を
{ title:"Active", field:"active", align:"center", formatter: "tickCross", headerFilter: true, width: 80, headerSort: false, headerFilterFunc : function(headerValue, rowValue, rowData, filterParams){ return rowValue==0 } },
とすれば、チェックOFFのフィルタになる。
rowData で1行のデータを参照できるので、
return rowData.active==0
でも同じこと。return rowValue==1 あるいは、return rowData.active==1 なら、この headerFilterFunc を
追記しないのと同じことである。