表(テーブル)の行を、列の値で並べ替えるなら、jQuery の tablesorter プラグインが便利。
表の列の見出しをクリックすることで、その列の値を基準に、行を並べ替えることができる。
-
jQuery の tablesorter プラグイン
jQuery の tablesorter プラグインの、導入方法、使い方、CSSテーマ、オプションなどについて。
-
jQuery の tablesorter プラグインによる表(テーブル)の項目並べ替え
jQuery の tablesorter プラグインを使い、表(テーブル)の列の見出しをクリックすることで、その列の値を基準に、項目を並べ替える基本的方法。
-
jQuery の tablesorter プラグイン blue テーマ
jQuery の tablesorter プラグインを使い、列の値を基準に、項目を並べ替えられる表(テーブル)において、「jquery.tablesorter.zip」に含まれている「blue」テーマを使った実装例(サンプル)。
-
jQuery の tablesorter プラグイン green テーマ
jQuery の tablesorter プラグインを使い、列の値を基準に、項目を並べ替えられる表(テーブル)において、「jquery.tablesorter.zip」に含まれている「green」テーマを使った実装例(サンプル)。
-
tablesorter の sortList オプションでページ表示時の並び基準を指定
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、ページを読み込んだとき、どの列を基準に並べるかを指定する方法。ページを読み込んだときの並び替え基準の指定には、「sortList」オプションを使う。
-
tablesorter の headers オプションで一部の列の並べ替えを無効に
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、一部の列の並べ替えはできないようにする方法。一部の列の並べ替えを無効にするには、「headers」オプションを使い、特定の列に対して、「sorter: false」を指定する。
-
tablesorter の sortMultiSortKey でマルチソート操作キーを設定
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、複数の列を基準とした並べ替え(マルチソート)を行うときの操作キーを設定する方法。操作キーを指定するには、「sortMultiSortKey」オプションを使う。
-
tablesorter の widgets オプションで奇数行と偶数行を色分けした表
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、奇数行と偶数行の背景色を色分けする方法。表の背景色を1行おきに色分けするには、「widgets」オプションを使う。
-
tablesorter の sortForce オプションで優先並べ替え基準の列を指定
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、強制的に優先並べ替え基準にする列を指定する方法。強制的に優先並べ替え基準にする列を指定するには、「sortForce」オプションを使う。
-
tablesorter と Pager プラグインで表の内容を複数ページに分ける
jQuery の tablesorter プラグインの「blue」テーマを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、表(テーブル)の内容を複数ページに分けて表示する方法。複数ページに分けるには、「Pager」プラグインを併用する。
-
jQuery の tablesorter において並べ変えた列の見出し背景色を変更
jQuery の tablesorter プラグインを使った、列の値を基準に、項目を並べ替えられる表(テーブル)において、並べ変え基準にした列の見出しの背景色を変更する方法。昇順、降順、別々に異なる色を指定する。