[スポンサードリンク]
[スポンサードリンク]

tablesorterの並び替え(ひらがな)方法

jQueryのプラグイン「tablesorter」を使用して特殊な並び替えで困ってたメモ。
「特殊な並び替え」と記載したが、日本語では頻度の高い並び替えだと思う。
少し「tablesorter.js」に手を加えます。


準備するもの

・jQuery (1.2.1以上)  ※tablesorterに付属されている「jquery-latest.js」でも可能です。 ・tablesorter.js ・jquery.metadata.js

やりたかった事

「名前(ふりがな)」での並び替え。 色々検索したが、 A:「ふりがな」の項目を追加する。 B:「metadata」を使用する。 の2パターンがあった。 Aは並び替え可能だが、横幅を取りたくなかったので却下。 Bは「北海道→1」、「沖縄→47」という都道府県コードみたいな感じの決まり事があれば可能だったが、 【文字列】を【数値】に変換されて並び替える処理だった為、「ひらがな」は全て「0」となり、出来なかった。

1:「tablesorter.js」のmetadataの処理をコピー

996行目~1005行目が「metadata」での処理。
ts.addParser({ id: "metadata", is: function (s) { return false; }, format: function (s, table, cell) { var c = table.config, p = (!c.parserMetadataName) ? "sortValue" : c.parserMetadataName; return $(cell).metadata()[p]; }, type: "numeric" });

2:「1」を貼り付けて修正

1006行目辺りに貼り付けると分かり易いかも。
ts.addParser({ id: "metatext", is: function (s) { return false; }, format: function (s, table, cell) { var c = table.config, p = (!c.parserMetatextName) ? "sortValue" : c.parserMetatextName; return $(cell).metadata()[p]; }, type: "text" });
※赤字が変更した箇所。  parserMetadataNameとかは別に変更しなくても問題無いけど、ソースに合わせた感じ。

3:HTMLファイル作成

これで「名前」をクリックすると「ひらがな」で並び替えが可能になります。 【「よみがな」フィールドは付けたくないんだ!(横幅的な意味で)】と言う方はお試しあれ。
[スポンサードリンク]
コメントフォーム



No.758 ひぐらし
- 2016-08-12 18:35:05
とても参考になりました。

残念ながら投稿されたままでは動作しませんでした。投稿内容に加えて、

jqery.metadata.jsをjqeury.metatext.jsと別名保存して、jsソースコードの「metadata」を「metatext」に一括置換して、jquery.metadata.jsと同じように読み込むと動作しました。

ご報告まで。