GitHubで見る

テーブルのCookie

Bootstrap TableのCookie拡張機能。テーブル状態の保存と復元を行います。

このページ

Cookie拡張機能は、テーブルの状態情報（ページネーション位置、並べ替え状態、1ページあたりの表示件数など）をCookieに保存し、ユーザーがページを再訪問したときに以前の設定を自動的に復元します。

使用方法

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

例

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

  • 詳細:

    テーブルの一意の識別子を設定します。ページに複数のテーブルが存在する場合、各テーブルはそれぞれのCookieデータを区別するために異なるIDを設定する必要があります。

  • デフォルト値: ''

cookiePath

  • 属性: data-cookie-path

  • 型: String

  • 詳細:

    Cookieのパスを設定します。デフォルトは現在のページのパスで、CookieがWebサイト全体または特定のディレクトリで有効になるように指定できます。

  • デフォルト値: 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を返します。

自動保存されるテーブル状態

このプラグインは、以下のテーブル状態情報を自動的に保存します：

  • ページ番号：現在のページ数
  • 1ページあたりの行数：1ページに表示されるレコード数
  • 検索テキスト：ユーザーが入力した検索キーワード
  • フィルタ条件：filter-controlで設定されたフィルタ状態
  • 並べ替え順序：昇順または降順
  • 並べ替えフィールド：現在並べ替えられている列名
  • 多重並べ替え：複数列の並べ替え設定
  • 非表示列：ユーザーが手動で非表示にした列
  • ビューモード：カードビューまたは通常のテーブルビュー