「jQuery Table Sort」をカンマの入った数値に対応させる方法

「jQuery Table Sort」は、テーブルにソート機能を加えるだけのシンプルなプラグインです。

こんな感じで使用します。(詳しい使い方は配布元を見て頂くとして)

JS

$("#simpleTable").stupidtable();

HTML

<table id="simpleTable">
    <thead>
        <tr>
        <th data-sort="int">int</th>
        <th data-sort="float">float</th>
        <th data-sort="string">string</th>
        </tr>
    </thead>
    <tbody>
  ...
  ... (rest of the table)

対応しているソート機能

• int
• float
• string

以上の3つのみです。 配布元には「出来る限りプラグインを軽くするためにこれだけしか用意してません。てか、これで十分っしょ？(意訳)」 って書いてあります。

本題

確かにソートの種類はこれだけで十分なんですけど、 このint や string では、1,000 とか 1,989 みたいに「,」が入っていると上手くソートしてくれない。 プラグインのソースを見てみる。↓これじゃ単純な数値しかソートできませんよねぇ。

sortFns = $.extend({}, {
  "int":function(a,b){ return parseInt(a, 10) - parseInt(b,10); },
  "float":function(a,b){ return parseFloat(a) - parseFloat(b); },
  "string":function(a,b){ if (a<b) return -1; if (a>b) return +1; return 0;}
}, sortFns);

どうしたらよいか。追加でソート機能が欲しいなら「自分で用意してね(意訳)」と書いてあります。
めんどくさいなぁ、と言いつつ 30 秒ぐらいで出来ました。
JS はこうやって書いて、

$("#simpleTable").stupidtable({
"intComma":function(a,b){ 
  var aNum = a.replace( /,/g, "" );
  var bNum = b.replace( /,/g, "" );
  
  return parseInt(aNum, 10) - parseInt(bNum,10); 
  }
});

ソートしたい(カンマのあるカラム)は、こうやって書いてください

<th data-sort="intComma">int</th>

ちなみに"intComma"はお好きな名前に変えても OK です。

裏ではカンマを除いた数値で並び替えをしてるので、
昇順降順きちんと並び替える事ができるはずです。