ColReorder

ColReorder 讓終端使用者能夠透過點擊和拖曳操作重新排序 DataTable 中的欄位。當在表格中呈現資料時，這非常有用，讓使用者可以將想要比較的欄位移動到彼此相鄰的位置，以便更容易比較。

值得注意的是，DataTable 的底層欄位資料結構會在此過程中被修改 - 如果您使用 API 與表格互動，這點非常重要。

下載

獲取和使用 ColReorder 的最簡單方法是使用 DataTables 下載建構器，您可以在其中選擇要在頁面上使用的軟體，並為您建立和託管單個 Javascript 和 CSS 檔案。

或者，您也可以將個別檔案包含在您的頁面上、下載發布套件或在 GitHub 上複製原始碼控制儲存庫。

初始化

ColReorder 可以用兩種不同的方式初始化和使用

• 作為 DataTables 建構函式的一部分，使用 colReorder 設定選項
• 一個 new 建構函式

在 DataTables 中

可以在 DataTable 上使用 DataTables 選項物件中的 colReorder 選項來初始化 ColReorder - 這只是一個布林值，雖然也可以使用物件進行細緻的控制（請參閱參考文件）

$('#myTable').DataTable( {
    colReorder: true
} );

建構函式

或者，可以在使用 Javascript new 關鍵字和 $.fn.dataTable.ColReorder 函式建構表格後，將 ColReorder 新增到表格中。此函式採用兩個參數

1. 要套用按鈕的 DataTable 實例
2. ColReorder 選項（與 colReorder 選項可用的選項相同）。

var table = $('#myTable').DataTable();

new $.fn.dataTable.ColReorder( table, {
    // options
} );

功能

ColReorder 具有以下功能

• 與 DataTables 非常容易整合
• 與所有其他 DataTables 外掛程式緊密整合
• 能夠排除第一個（或更多）欄位成為可移動的欄位
• 預先定義欄位順序
• 與 DataTables 儲存整合