FREE このライブラリの利用は自由です。クレジット表記は不要です。作者は当ライブラリの利用に関するいかなる責任も負いません。
基本的な利用方法
JavaScript と CSS の 2 ファイルをダウンロードしてサーバに配置したら、以下の 2 行を <head> タグ内に記述します。
<link href="sortable_table.css" rel="stylesheet" />
<script src="sortable_table.js"></script>
ソート機能を有効化したいテーブルの <table> タグの class に sortable と指定します。
<table class="sortable">
これにより自動的にテーブルの項目名をクリックすると並び替えが有効になります。
| 数値の列 | 文字の列 |
|---|---|
| 1 | January |
| 2 | February |
| 3 | March |
| 4 | April |
高度な利用方法
デフォルトではセルに表示されている内容を用いてソートします。文字列か数値かは自動的に判別されます。
ただし、セルに表示された文字列でソートするのは都合が悪い場合は、対象のセルにソート用の代替データを data-sort 属性で指定できます。
例えば、以下の場合、セル内の "February" ではなく、ソート用の "2" の値を使用してソートされます。
<td data-sort="2">February</td>
| 数値の列 | 文字の列 (data-sort 指定) |
|---|---|
| 1 | January |
| 2 | February |
| 3 | March |
| 4 | April |