jquery Tabulator: 「visible records」を「全選択」

ここで愚痴ったヤツの解決。

愚痴のおさらい: 「フィルター状態は全然関係なく、ほんとに全部選択しちゃう。これはちょっとなぁ…。」。ちょっと補足。これは、Programmatic Row Selection での説明の通りで「.tabulator("selectRow", 1);」のようにすればデータ1を持つ行選択、1 を指定しなければ全選択になる、その「オールオアナッシングがやだ」て話、だった。

そもそもそこで愚痴に書ききらなかったけれど、(その美しくて読みやすい見た目とは裏腹に) Tabulator のドキュメントって微妙に使いにくくて、たとえばパーマネントリンクが付いてない箇所が多くて説明でリンクしにくいとかあるんだけれど、…、まぁドキュメントは相当力作だしね、これに文句を言うのは贅沢過ぎるのかもな、とは思う。ともあれその「非常にいろいろ探しにくいドキュメント」を何度も探しても、全然「フィルター状態は全然関係なく、ほんとに全部選択しちゃう。これはちょっとなぁ…。」の解になりそうなものが見つけられず、仕方なく Google 検索。

ようやく issues#178 を発見。つまり「フィルター状態がかかった上で見えてるもの」を取得するにはこうするとのこと:

1 //total number of rows
2 var totalDataCount = $("#example-table").tabulator("getData").length;
3 
4 //number of filtered rows
5 var filteredDataCount = $("#example-table").tabulator("getData", true).length;

いやぁ、これは出てこんわ。ちゃんと見出しレベルで出て説明されて欲しいようなもんだと思うんだけれどなぁ。

うん、これで見えてるもの選択出来るね…、と思ったが、うーん、selectRow が「id というカラム」を大前提にしているらしいことに対する迂回手段がわからず、すなわち以下がダメ:

ワタシのヤツの例
1     $("#charactors-of-selected-selectall").on("click", function () {
2         let tab = $("#charactors-of-selected");
3         tab.tabulator("getData", true).forEach(function (e, i) {
4             // indexで良さそうに見えるんだけどねドキュメントからは、けど
5             // どうも id というカラムとの合致をみているような振る舞いをする。
6             tab.tabulator("selectRow", i);  // ゆえこれは Tabulator が警告のうえ無視する
7             //tab.tabulator("selectRow", e);  // これもダメ
8         });
9     });

どうしたもんかともう少し探ってたら、やっと issues#506 を発見。で…

ワタシのヤツの例
1     $("#charactors-of-selected-selectall").on("click", function () {
2         let tab = $("#charactors-of-selected");
3         tab.tabulator("selectRows", true); // no such method ですと、3.4.1 使ってるんだがなぁ
4     });

そもそも、selectRows なんてドキュメントに書かれてなくて、書かれてないのだから no such method はまぁそうでしょうねとは思う。だったらこの issue はなんなんだ。

で、悶々とドキュメントを眺めていると、example で「getRows」を使っていることがわかり、これも上でみつけた「getData」と同じノリなんではないのかしらと思い…:

1     $("#charactors-of-selected-selectall").on("click", function () {
2         let tab = $("#charactors-of-selected");
3         tab.tabulator("selectRow", tab.tabulator("getRows", true));
4     });

正解。念のため:

1     $("#charactors-of-selected-selectall").on("click", function () {
2         let tab = $("#charactors-of-selected");
3         // これだとフィルタ状態に依存しない、だよね?
4         tab.tabulator("selectRow", tab.tabulator("getRows"));
5     });

正解。

で、見つかってみてから改めてドキュメント全体を探してみたら、あぁ、Retrieving Row Components としてちゃんと書かれてる。うーん、なにがどう使いにくいんだろうかこのドキュメント。わかってから探せば書いてあることが多いんだけど、最初に探すと見つからないんだよなぁ。


プログラマチックに「全選択」がさ、「見えないとこまで含めて全選択」なんて、「あえてそうしてもろても嬉しぅない」と思うことがほとんどだと思うわけだわよ。「絞り込んだものを全選択」したいんでしょう、ふつうは。なのでこれ、ずっとストレスだった。解決してよかったよかった。



Related Posts