なぜか何も説明なしだったので
結論から先に話すとWordPressプラグインのtablesorterを削除してオリジナル(厳密には違うが)の tablesorter.jsを導入しました。
tablesorter.js
以下現在の非公式ドキュメント
https://mottie.github.io/tablesorter/docs/index.html
簡単に説明するとhtmlのテーブルにソートやフィルター機能を提供するjQueryプラグインらしいです。
そもそも自分も使ったの初めてで大体先駆者の受け売り。
厳密にはオリジナルじゃないってのは元の開発者はもう開発しておらず他の開発者がフォークして開発を続けているかららしい。オープンソースの強み。
ちなみに本来の公式ページは手付かず状態でアクセスするとセキュリティソフトに検知されるっぽい。
Githubでは Latest commit 8 days ago とあったのでまだ続いているみたい。
んで、今回はこちらのtablesorterを使ってフィルターも追加して無事に実装しましたとさ。
WordPressプラグインはあくまでソートのみを実装可能にするものであってフィルター機能を提供するjquery.tablesorter.widgets.jsやそれに関するcssは読み込んでいないので。
WordPressプラグインで動かなかった原因
実は動かなかったというのは半分嘘で実装中は動いていたのと、どうせ誰も見ないｗからめんどくさくてそのままにしたのでした。
ではなぜ昨日まで動いていなかったのかというと、ぶっちゃけまだ完璧に調査したわけじゃないんですけど多分プラグイン側のtablesorter();がテーブルを作るより前に呼ばれていたからなのかなぁ？
プラグイン側のwp-script.jsでは
jQuery(document).ready(function($) { $('.tablesorter .sortless').addClass('{sorter: false}'); $('.tablesorter').tablesorter({sortLocaleCompare: true });});となっていてHTMLの読み込み完了と同時にページ内のtablesorterクラスのテーブルにtablesorterを適用するのでajaxを使った動的テーブルには弱かったみたい。
tablesorter();が実行される前にデータを取得してテーブルを構築する、もしくは静的テーブルなら問題なくソート出来ていたので開発中に取得するマスターデータ増やしてレスポンスが延びたタイミングで動作しない感じになりました。
他のサイトでも動的にテーブルを拡張した場合にtablesorter();実行時のソート機能しか働かないって内容あったのでそれなのかなと。
ちなみに tablesorter(); 実行後に変化したテーブルのソート機能に関しては
$("#テーブルID").trigger("update");で更新できるらしい。
試してないけどプラグイン側のtablesorterにもupdate関数があるみたいなんでうまく呼び出せばソートできていたのかな。
まぁフィルターないし結局自分で tablesorter.js入れたほうがよかった。
ついでにCLIP STUDIO PAINT PRO買いました
うんち量産の予感・・・