tablesorter の sortMultiSortKey でマルチソート操作キーを設定

jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表（テーブル）において、複数の列を基準とした並べ替え（マルチソート）を行うときの操作キーを設定する方法。操作キーを指定するには、「sortMultiSortKey」オプションを使う。

「sortMultiSortKey」オプションで指定しない場合のデフォルト値は、キーボードの「Shift」キーに設定されている。

実装例（サンプル）

実装例（サンプル）の動作について

• 表の列の見出し（「商品名」「ID」「値段」「評価」「デザイン」）をクリックすると、その列の値を基準に、商品を並べ替える。昇順の列は降順に並べ替え、降順の列は昇順に並べ替え、昇順でも降順でもない列は昇順に並べ替える。
• 列の見出しにある「」が、昇順で並べたときは「」に変わり、降順で並べたときは「」に変わる。
• 「値段」で並べ替えた後、キーボードの「Alt」キーを押しながら、「評価」をクリックすると、「値段」が同じ商品だけ、さらに「評価」を基準に並べ替える。この例の場合、8800円の商品3つを、さらに「評価」に基づいて並べ替える。
• 並べ替えの基準にした列の見出しの背景色は、　この色　に変わる。複数の列を基準にしたときは、複数の見出しの背景色が、　この色　に変わる。

実装例（サンプル）のソースコード

読み込み

パスは、それぞれ、アップロードした場所を指定する。

JavaScript

複数の列を基準とした並べ替え（マルチソート）を行うときの操作キーを、キーボードの「Alt」キーに設定。

sortMultiSortKey オプションで指定しない場合のデフォルト値は、キーボードの「Shift」キーに設定されている。

CSS

HTML