GitHubで見る
テーブル列の並べ替え
Bootstrap Tableの列並べ替え拡張機能。ドラッグによるテーブル列の順序調整を可能にします。
このページ
依存関係
この拡張機能は以下のライブラリに依存しています:
使用方法
<link rel="stylesheet" href="dragtable.css">
<script src="jquery-ui.js"></script>
<script src="jquery.dragtable.js"></script>
<script src="extensions/reorder-columns/bootstrap-table-reorder-columns.js"></script>
例
オプション
reorderableColumns
-
属性:
data-reorderable-columns -
型:
Boolean -
詳細:
列のドラッグ機能を有効にするかどうかを制御します。
trueに設定すると、ユーザーはテーブルヘッダーをドラッグして列の順序を調整できます。 -
デフォルト値:
false
dragaccept
-
属性:
data-dragaccept -
型:
String -
詳細:
指定されたCSSクラスを持つ列のみをドラッグ可能にします。
-
デフォルト値:
null
maxMovingRows
-
属性:
data-max-moving-rows -
型:
Integer -
詳細:
ドラッグ時に同時に移動する行数を制御します。1に設定するとテーブルヘッダーのみを移動します。超大規模なテーブル(セル数 > 1000)の場合、パフォーマンスを向上させるためにこの設定を使用することをお勧めします。
-
デフォルト値:
10
イベント
onReorderColumn (reorder-column.bs.table)
列のドラッグが完了したときにトリガーされます。パラメータは新しいテーブルヘッダーフィールドの順序です。
メソッド
orderColumns
-
パラメータ:
object、例:{name: 0, price: 1} -
詳細:
渡された設定オブジェクトに基づいて列の順序を並べ替えます。オブジェクトのキーは field(列フィールド名)、値は列のインデックス(0から始まります)です。