テーブルのソート

Web開発で、テーブルの内容を並び替える機能を組み込むのは少しメンドウだが、それを簡単に、高い完成度で備えるソフトを発見！JavaScriptひとつで、ソートロジックを簡単に組み込むことが可能になる。メモしておこう。

「Table Sorter」JavaScriptのみで実現するソートライブラリ。
http://neil.fraser.name/software/tablesort/

●1.JavaScriptファイルを一つだけ読み込む。

<script language="'JavaScript1.2'" src="'tablesort.js'"></script>

●2.普通より少し丁寧に？に table タグを作成する。

　　・ヘッダ部分は thead タグと th タグで作る。
　　・データ部分は全体を tbody タグで囲んで、td タグで記述。
　　・ちなみに、フッタ部分を tfoot タグで囲むと、ソートの影響を受けない。

●3.ヘッダの th タグに、並び替えの方法を指定するためのラベルをつける。

　　・case:普通の並び替え
　　・nocase:大文字小文字を問わずに並び替え
　　・num:数値の並び替え

---------------------------------------------------------
<table>
<thead>
<tr>
<th label="nocase">Name</th>
<th label="nocase">Gender</th>
<th label="num">Score</th>
<th label="case">Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>すずき</td>
<td>男</td>
<td>92%</td>
<td>suzuki@hoge.com</td>
</tr>
<tr>
<td>さとう</td>
<td>女</td>
<td>85%</td>
<td>sato@hoge.com</td></tr>
<tr>
<td>たなか</td>
<td>男</td>
<td>9%</td>
<td>tanaka@hoge.com</td>
</tr>
</tbody>
</table>
---------------------------------------------------------

これだけで完成！超お手軽！公式サイトのデモも試してみよう。