これの続きではあるけれど、これをなかったことにする世界線でもある。
download が壊れている話に先に追記しておいたが、繰り返しておく:
1 <!-- ... -->
2 <script>
3 /* ... */
4 var table = new Tabulator("#actor_basinf", {
5 "height": "800px",
6 "columnDefaults": {
7 "tooltip": true,
8 "headerSortTristate": true,
9 },
10 "headerFilterLiveFilterDelay": 800,
11
12 "initialHeaderFilter": [
13 {
14 "field": "redi",
15 "value": "^$",
16 },
17 ],
18 /* ... */
19 "columns": [
20 /* ... */
21 {
22 "field": "redi",
23 "headerFilter": "input",
24 "headerFilterFunc": "regex",
25 "formatter": function (cell, formatterParams, onRendered) {
26 let pn = cell.getValue();
27 return "<a href='https://ja.wikipedia.org/wiki/" +
28 pn + "' target=_blank>" + pn + "</a>";
29 },
30 "headerTooltip": "転送された場合、転送先。"
31 },
32 /* ... */
33 ],
34 "layout": "fitColumns",
35 "data": actor_basinf_data
36 });
37 /* ... */
38 </script>
39 <!-- ... -->
とすると、これがエラーで動かない。で、試しに Tabulator のバージョンを 4.2.7 に変えてみたところ、これは今のワタシのコードが使っている「cell.getRow().getCell(filed).getValue()」が 4.2 では動作しないのでこれを書き換えるる必要はあったものの、initialHeaderFilter はドキュメントに書かれている通りに動いた。
ワタシが挙げなくてもすぐに誰かが気付きそうな気がするので、ちょっとしばらく待ってみようかと思う。それよりもオレ的ネタとしては「「cell.getRow().getCell(filed).getValue()」が 4.2 では動作しない」との格闘をいったんネタにしたいと思う。これは別のネタとして後日。
ひとまずワタシ的にはまぁ「声優世代表のおとも」が使えればいいので「5.0.6 ねばならぬ」てことはないので、「使えるものならなるべく新しいバージョンを」で十分。結果的に今のところ「4.9.3 でいいかな」てことなのだが、こういうバージョンの行き来は今後もある程度繰り返すだろうから、「なるべくバージョン違いで使えなくなる箇所は減らしておきたい」と。3.x から 4.x の変更が大きいからさ、その大きな変更以外のインパクトは小さくしときたいでしょうよ。
コメントに全部書いたのでそれを引用しちゃえばいいよね、こういうことだ:
1 <html>
2 <head jang="ja">
3 <meta charset="UTF-8">
4
5 <link href="https://cdnjs.cloudflare.com/ajax/libs/tabulator/4.9.3/css/tabulator_site.min.css" rel="stylesheet">
6 <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tabulator/4.9.3/js/tabulator.min.js"></script>
7 <script type="text/javascript" src="https://oss.sheetjs.com/sheetjs/xlsx.full.min.js"></script>
8
9
10 <!-- Tabulator ではなく csv parser として jquery-csv を使いたくて、のための jquery -->
11 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
12 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/1.0.21/jquery.csv.js"></script>
13
14 <script type="text/javascript" src="actor_basinf_data.js"></script>
15
16 <!-- ... -->
17
18 </head>
19 <body>
20 <!-- ... -->
21 <div id="actor_basinf"></div>
22 <!-- ... -->
23 <script>
24 /* ... */
25 var table = new Tabulator("#actor_basinf", {
26 "height": "800px",
27
28 /* --------------*/
29 /*
30 * 5.0 で各種デフォルトが columnDefaults の中に入ったが、5.0.6 時点では
31 * 「かつて columnDefaults の外にいたもの」がそのままになっていても
32 * deprecated 警告が出るだけでそのまま動く。4.x で columnDefaults を
33 * 書いてもこれも無視されるだけなので、ひとまず当面「両方書いておきゃいい」。
34 */
35 "tooltips": true,
36 "headerSortTristate": true,
37 "columnDefaults": {
38 /* 注意: 「tooltips」ではない。「tooltip」である。 */
39 "tooltip": true,
40
41 /* これはいつから使えたのかな? かつては「columnDefaults」の外にいたやつ。 */
42 "headerSortTristate": true,
43 },
44 /* --------------*/
45
46 "columns": [
47 /* ... */
48 {
49 "field": "wp",
50 "title": "wikipedia",
51 "formatter": function (cell, formatterParams, onRendered) {
52 let pn = cell.getValue();
53 if (!pn) {
54 /* ---------------------------------------
55 Tabulator 5.0.6 の initialHeaderFilter がどうやら壊れているようで
56 動かないので Tabulator を 4.2.7 に乗り換えると、その場合は今度は
57 cell.getRow().getCell("dymd").getValue()
58 が動かない。(cell.getRow().getCell("dymd") が「false」を返している
59 らしい。なんで?) Tabulator を 4.9.3 にすれば initialHeaderFilter
60 も正しく動作しつつ cell.getRow().getCell("dymd").getValue() も
61 動くが、「4.2.7 でも 4.9.3 でも動き、5.0.6 でも initialHeaderFilter
62 を使わないなら問題ない」となる書き方を探ってみたが、以下が正解らしい:
63 cell.getRow().getData()["dymd"]
64 OO 的には getCell を介する方が良いのだとは思うけれど、動くバージョンの
65 広さは getData() で直接アクセスする版の方が広いと思う(4.0.5 でも使え
66 る)ので、たぶん当面こちらの書き方を優先したほうがよさそうだ。
67 ------------------- */
68 let n0 = cell.getRow().getData()["nm"];
69 n0 = n0.replace(new RegExp(", .*$"), "");
70 pn = n0.replace(new RegExp("\\s+", "g"), "");
71 }
72 return "<a href='https://ja.wikipedia.org/wiki/" +
73 pn + "' target=_blank>" + pn + "</a>";
74 },
75 },
76 {
77 "field": "redi",
78 "headerFilter": "input",
79 "headerFilterFunc": "regex",
80 "formatter": function (cell, formatterParams, onRendered) {
81 let pn = cell.getValue();
82 return "<a href='https://ja.wikipedia.org/wiki/" +
83 pn + "' target=_blank>" + pn + "</a>";
84 },
85 "headerTooltip": "転送された場合、転送先。"
86 },
87 /* ... */
88 ],
89 "initialHeaderFilter": [
90 {
91 "field": "redi",
92 "value": "^$",
93 },
94 ],
95 "layout": "fitColumns",
96 "data": actor_basinf_data
97 });
98 </script>
99 </html>
これで万事問題ないというわけでもなくて、非常に些細な問題が一つ。ヘッダフィルタの input フィールドのプロンプト文字列が、とても不適切な「filter colour」になる。この問題についてはすぐに解決出来る:
1 /* ... */
2 var table = new Tabulator("#actor_basinf", {
3 "height": "800px",
4
5 /* --------------*/
6 /*
7 * 5.0 で各種デフォルトが columnDefaults の中に入ったが、5.0.6 時点では
8 * 「かつて columnDefaults の外にいたもの」がそのままになっていても
9 * deprecated 警告が出るだけでそのまま動く。4.x で columnDefaults を
10 * 書いてもこれも無視されるだけなので、ひとまず当面「両方書いておきゃいい」。
11 */
12 "tooltips": true,
13 "headerSortTristate": true,
14 "headerFilterPlaceholder": "", /* 4.x ではなぜかデフォルトが「filter colour」… */
15 "columnDefaults": {
16 /* 注意: 「tooltips」ではない。「tooltip」である。 */
17 "tooltip": true,
18
19 /* これはいつから使えたのかな? かつては「columnDefaults」の外にいたやつ。 */
20 "headerSortTristate": true,
21
22 /*
23 * 5.0 ではもとから "headerFilterPlaceholder": "" なのでほんとにブランクが
24 * 目的なら書かなくてもよい。
25 */
26 "headerFilterPlaceholder": "",
27 },
28 /* --------------*/
29
30 "columns": [
31 {
32 /* ... */
二重化は気持ち悪いが、一時的にはやむを得ないか。
てなわけで「wikipedia をスクレイプして「声優世代表のおとも html」、な、きっと ver 11」:
2021-11-05追記:
5日前、つまりワタシがこのページを書いたその日にはもうリリースされていた 5.0.7 で initialHeaderFilter の問題は修正されてるみたい。
ので上で書いた情報は徒労だったことにはなる。ただ、こうしたバージョンの行き来は何度か繰り返すだろうと思うので、無駄だったとは思ってないよ、たぶん。