Table Cookie

Bootstrap Table 的 Cookie 擴展，用於保存和恢復表格狀態。

Cookie 擴展可以將表格的狀態信息（如分頁位置、排序狀態、每頁顯示條數等）保存到 Cookie 中，當用戶重新訪問頁面時自動恢復之前的設置。

用法

<script src="extensions/cookie/bootstrap-table-cookie.js"></script>

示例

Cookie

選項

cookie

• 屬性: data-cookie

• 類型: Boolean

• 詳情:

  是否啟用 Cookie 保存功能。設置為 true 時，表格的分頁狀態、排序狀態、搜索條件等信息將被保存到 Cookie 中。

• 默認值: false

cookieCustomStorageDelete

• 屬性: data-cookie-custom-storage-delete

• 類型: function

• 參數

  • cookieName：值的名稱，例如搜索關鍵字

• 詳情:

  使用自定義函數刪除已保存的值。 只有在 cookieStorage 選項設置為 customStorage 時才需要實現此函數。

• 默認值: undefined

cookieCustomStorageGet

• 屬性: data-cookie-custom-storage-get

• 類型: function

• 參數

  • cookieName：值的名稱，例如搜索關鍵字

• 詳情:

  使用自定義函數獲取已保存的值。 只有在 cookieStorage 選項設置為 customStorage 時才需要實現此函數。

• 默認值: undefined

cookieCustomStorageSet

• 屬性: data-cookie-custom-storage-set

• 類型: function

• 參數

  • cookieName：值的名稱，例如搜索關鍵字
  • value：要保存的值

• 詳情:

  使用自定義函數保存值到存儲中。 只有在 cookieStorage 選項設置為 customStorage 時才需要實現此函數。

• 默認值: undefined

cookieDomain

• 屬性: data-cookie-domain

• 類型: String

• 詳情:

  設置 Cookie 的域名。通常需要去掉 www. 前綴，例如 example.com。

• 默認值: null

cookieExpire

• 屬性: data-cookie-expire

• 類型: String

• 詳情:

  設置 Cookie 的過期時間，格式為 '數字+單位'。例如 '2h' 表示 2 小時。 支持的時間單位：'s'（秒）、'mi'（分鐘）、'h'（小時）、'd'（天）、'm'（月）、'y'（年）。

• 默認值: 2h

cookieIdTable

• 屬性: data-cookie-id-table

• 類型: String

• 詳情:

  設置表格的唯一標識符。當頁面中存在多個表格時，每個表格需要設置不同的 ID，用於區分各自的 Cookie 數據。

• 默認值: ''

cookiePath

• 屬性: data-cookie-path

• 類型: String

• 詳情:

  設置 Cookie 的路徑。默認為當前頁面路徑，可用於指定 Cookie 在整個網站或特定目錄下生效。

• 默認值: null

cookieSecure

• 屬性: data-cookie-secure

• 類型: Boolean

• 詳情:

  是否啟用安全模式。設置為 true 時，Cookie 只能在 HTTPS 連接下傳輸，提高數據安全性。

• 默認值: null

cookieSameSite

• 屬性: data-cookie-same-site

• 類型: string

• 詳情:

  設置 SameSite cookie 屬性的值，更多信息可參考 SameSite 文檔。

• 默認值: Lax

cookieStorage

• 屬性: data-cookie-storage

• 類型: String

• 詳情:

  設置擴展使用的存儲方式。可選值：cookieStorage、localStorage、sessionStorage 或 customStorage。

  當使用 customStorage 時，需要同時實現 cookieCustomStorageGet、cookieCustomStorageSet 和 cookieCustomStorageDelete。

• 默認值: cookieStorage

cookiesEnabled

• 屬性: data-cookies-enabled

• 類型: Array

• 詳情:

  設置需要保存的表格屬性數組，例如 sortOrder、sortName、sortPriority、pageNumber、pageList、hiddenColumns、searchText、filterControl 等。

• 默認值: ['bs.table.sortOrder', 'bs.table.sortName', 'bs.table.sortPriority', 'bs.table.pageNumber', 'bs.table.pageList', 'bs.table.hiddenColumns', 'bs.table.searchText', 'bs.table.filterControl', 'bs.table.cardView', 'bs.table.customView']

方法

deleteCookie

• 參數: cookieName

• 詳情:

  根據名稱刪除已保存的 cookie。

getCookies

• 參數: undefined

• 詳情:

  返回已保存的 cookie。

自動保存的表格狀態

該插件會自動保存以下表格狀態信息：

• 頁碼：當前所在頁數
• 每頁條數：每頁顯示的記錄數量
• 搜索文本：用戶輸入的搜索關鍵詞
• 過濾條件：通過 filter-control 設置的過濾狀態
• 排序順序：升序或降序
• 排序字段：當前排序的列名
• 多重排序：多列排序的配置
• 隱藏列：用戶手動隱藏的列
• 視圖模式：卡片視圖或普通表格視圖