KeyTable

DataTable 的試算表導覽功能,可以為資料輸入提供有吸引力且快速的介面,對於那些有使用 Excel、OpenOffice 或類似軟體經驗,現在正在轉換到網頁應用程式的使用者來說,也是非常熟悉的介面。

KeyTable 為 DataTables 新增了鍵盤導覽功能,其操作方式與傳統的試算表應用程式完全相同。結合 AutoFillEditor 的內嵌編輯功能,可以建立一個真正的試算表式環境。此外,使用 Buttons 的鍵盤輔助功能,可以僅使用鍵盤即可存取完全可編輯的 DataTable。

下載

取得和使用 KeyTable 最簡單的方法是使用 DataTables 下載產生器,您可以在其中選擇您希望在頁面上使用的軟體,並建立並託管單一的 Javascript 和 CSS 檔案。

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

初始化

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

  • 作為 DataTables 建構函式的一部分,使用 keys 組態選項
  • 一個 new 建構函式

在 DataTables 中

可以在 DataTable 上初始化 KeyTable,方法是在 DataTables 選項物件中使用 keys 選項 - 這只是一個布林值,儘管也可以使用物件來設定初始焦點(請參閱參考文件

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

建構函式

或者,可以使用 Javascript new 關鍵字和 $.fn.dataTable.KeyTable 函數在建構表格後,將 KeyTable 新增至表格中。此函數接受兩個參數

  1. 要套用按鈕的 DataTable 實例
  2. KeyTable 選項(這與 keys 選項可用的選項相同)。
var table = $('#myTable').DataTable();

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

請注意,當使用此初始化方法時,KeyTable 的事件和 API 方法仍然是使用 DataTables API 存取,而 DataTables API 會擴充以滿足其需求。

功能

主要功能包括

  • 易於使用的試算表式互動
  • 與 DataTables 完全整合
  • 內建支援 Editor
  • 易於使用的事件
  • 支援 Bootstrap、Foundation 和 DataTables 支援的其他樣式框架。