方法

Bootstrap Table 的方法 API。

調用語法：$('#table').bootstrapTable('method', parameter)。

注意： 下面的方法名稱（例如 append、check、getData）是在通過 JavaScript 調用 Bootstrap Table 方法時使用的確切方法名。

例如：$('#table').bootstrapTable('append', data)

append

• 參數: data

• 詳情:

  將 data 追加到表格中。

• 示例: Append

check

• 參數: index

• 詳情:

  選中指定索引的行。行索引從 0 開始計數。

• 示例: Check/Uncheck

checkAll

• 參數: undefined

• 詳情:

  選中當前頁的全部行。

• 示例: Check/Uncheck All

checkBy

• 參數: params

• 詳情:

  根據指定字段的值數組選中匹配的行，params 包含以下屬性：

  • field：用於查找和匹配記錄的字段名稱。
  • values：需要選中的行的字段值數組。
  • onlyCurrentPage（默認值：false）：若為 true，僅選中當前頁可見的數據；啟用分頁時會忽略其他頁的數據。

• 示例: Check/Uncheck By

checkInvert

• 參數: undefined

• 詳情:

  反選當前頁的行。會觸發 onCheckSome 與 onUncheckSome 事件。

• 示例: Check Invert

collapseAllRows

• 參數: undefined

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將折疊所有已展開的行。

• 示例: Expand/Collapse All Rows

collapseRow

• 參數: index

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將折疊傳入 index 的行。

• 示例: Expand/Collapse Row

collapseRowByUniqueId

• 參數: uniqueId

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將折疊傳入 uniqueId 的行。

• 示例: Expand/Collapse Row by uniqueId

destroy

• 參數: undefined

• 詳情:

  銷毀 Bootstrap Table。

• 示例: Destroy

expandAllRows

• 參數: undefined

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將展開所有行。

• 示例: Expand/Collapse All Rows

expandRow

• 參數: index

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將展開傳入 index 的行。

• 示例: Expand/Collapse Row

expandRowByUniqueId

• 參數: uniqueId

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將展開傳入 uniqueId 的行。

• 示例: Expand/Collapse Row by uniqueId

filterBy

• 參數:

  • filter - 過濾條件對象，默認值：{}
  • options - 選項對象，默認值：

    {
        'filterAlgorithm': 'and'
    }

• 詳情:

  （僅支持客戶端模式）根據指定條件過濾表格數據。

  過濾方式包括：

  • 保持 options 為空時使用 and 過濾算法
  • 將 filterAlgorithm 設為 or 使用”或”邏輯過濾
  • 傳入自定義函數作為 filterAlgorithm 實現高級過濾邏輯

  過濾算法詳解

  • And（與邏輯）

    • 示例：{age: 10} 僅顯示年齡等於 10 的數據
    • 支持數組值：{age: 10, hairColor: ['blue', 'red', 'green']} 查找年齡等於 10 且發色為藍、紅或綠的數據

  • Or（或邏輯）

    • 示例：{age: 10, name: "santa"} 會顯示年齡為 10 或 名稱為 santa 的全部數據

  • Custom（自定義算法）

    • 使用自定義函數實現復雜過濾邏輯
    • 函數接收兩個參數：
      • row：當前行的數據對象
      • filters：過濾條件對象
    • 返回 true 保留該行，返回 false 則過濾掉該行

• 示例: Filter By

getData

• 參數: params

• 詳情:

  獲取表格中已加載的數據。

  • useCurrentPage：若為 true，只返回當前頁數據。
  • includeHiddenRows：若為 true，包含隱藏行。
  • unfiltered：若為 true，返回所有數據（未過濾）。
  • formatted：按已定義的 formatter 返回格式化值。

• 示例: Get Data

getFooterData

• 參數: undefined

• 詳情:

  獲取頁腳中已加載的數據。

• 示例: Get Footer Data

getHiddenColumns

• 參數: undefined

• 詳情:

  獲取被隱藏的列。

• 示例: Get Visible/Hidden Columns

getHiddenRows

• 參數: show

• 詳情:

  獲取所有隱藏行。當參數 show 為 true 時，會同時顯示這些隱藏行；若為 false 或未提供，則僅返回隱藏行的數據而不顯示。

• 示例: Get Hidden Rows

getOptions

• 參數: undefined

• 詳情:

  返回選項對象。

• 示例: Get Options

getRowByUniqueId

• 參數: id

• 詳情:

  獲取表格中包含傳入 id 的行數據。

• 示例: Get Row By Unique Id

getScrollPosition

• 參數: undefined

• 詳情:

  獲取當前滾動位置，單位為 'px'。

• 示例: Get Scroll Position

getSelections

• 參數: undefined

• 詳情:

  返回所有已選中的行數據。當沒有記錄被選中時，返回空數組。

  注意： 在執行搜索、切換頁面或排序等操作時，已選中的行會被自動取消選擇。如需在操作後保留選擇狀態，請配置 maintainMetaData 選項。

• 示例: Get Selections

getVisibleColumns

• 參數: undefined

• 詳情:

  獲取可見列。

• 示例: Get Visible/Hidden Columns

hideAllColumns

• 參數: undefined

• 詳情:

  隱藏所有列。

• 示例: Show/Hide All Columns

hideColumn

• 參數: field

• 詳情:

  隱藏指定 field 的列。 參數可以是字符串或數組。

• 示例: Show/Hide Column

hideLoading

• 參數: undefined

• 詳情:

  隱藏加載狀態。

• 示例: Show/Hide Loading

hideRow

• 參數: params

• 詳情:

  隱藏指定行。params 至少包含以下屬性之一：

  • index：行索引。
  • uniqueId：該行的 uniqueId 值。

• 示例: Show/Hide Row

insertRow

• 參數: params

• 詳情:

  插入新行。params 包含以下屬性：

  • index：插入的行索引。
  • row：行數據。

• 示例: Insert Row

load

• 參數: data

• 詳情:

  將 data 加載到表格中，舊數據會被替換。

• 示例: Load

mergeCells

• 參數: params

• 詳情:

  合並多個單元格。params 包含以下屬性：

  • index：行索引。
  • field：字段名。
  • rowspan：需要合並的行數。
  • colspan：需要合並的列數。

• 示例: Merge Cells

nextPage

• 參數: undefined

• 詳情:

  跳轉到下一頁。

• 示例: Select/Prev/Next Page

prepend

• 參數: data

• 詳情:

  在表格開頭插入 data。

• 示例: Prepend

prevPage

• 參數: undefined

• 詳情:

  跳轉到上一頁。

• 示例: Select/Prev/Next Page

refresh

• 參數: params

• 詳情:

  刷新/重新加載遠程數據。支持以下參數配置：

  • silent（默認值：false）：設為 true 時靜默刷新，不顯示加載狀態。
  • url：可選，臨時覆蓋當前請求的 URL。
  • pageNumber：可選，指定要跳轉的頁碼。
  • pageSize：可選，指定每頁顯示的記錄數。
  • query：可選，為本次請求添加額外的查詢參數對象。

  示例用法：

  // 靜默刷新
  $('#table').bootstrapTable('refresh', {silent: true})
  
  // 修改 URL 和分頁參數
  $('#table').bootstrapTable('refresh', {
    url: '/new/api/endpoint',
    pageNumber: 2,
    pageSize: 20
  })
  
  // 添加查詢參數
  $('#table').bootstrapTable('refresh', {
    query: {status: 'active', category: 'electronics'}
  })

• 示例: Refresh

refreshOptions

• 參數: options

• 詳情:

  刷新表格選項。

• 示例: Refresh Options

remove

• 參數: params

• 詳情:

  從表格中移除數據。params 包含以下屬性：

  • field：用於匹配要刪除行的字段名。可以使用特殊字段 $index 按行索引刪除。
  • values：要刪除行的字段值數組。如果使用 $index 特殊字段，可傳入行索引數組。

  使用示例：

  // 根據 id 字段刪除
  $('#table').bootstrapTable('remove', {
    field: 'id',
    values: [1, 2, 3]
  })
  
  // 根據行索引刪除（從 0 開始）
  $('#table').bootstrapTable('remove', {
    field: '$index',
    values: [0, 2, 4]
  })
  
  // 根據其他字段刪除
  $('#table').bootstrapTable('remove', {
    field: 'name',
    values: ['John', 'Jane']
  })

• 示例: Remove

removeAll

• 參數: undefined

• 詳情:

  刪除表格中的所有數據。

• 示例: Remove All

removeByUniqueId

• 參數: id

• 詳情:

  刪除表格中包含傳入 id 的行數據。

• 示例: Remove By Unique Id

resetSearch

• 參數: text

• 詳情:

  設置搜索關鍵字 text。

• 示例: Reset Search

resetView

• 參數: params

• 詳情:

  重置 Bootstrap Table 視圖（例如重置表格高度）。params 包含：

  • height：表格高度。

• 示例: Reset View

scrollTo

• 參數: value|object

• 詳情:

  • value
    • 滾動到數值 value 對應的位置，單位為 'px'，傳入 'bottom' 表示滾動到底部。
  • object
    • 滾動到指定單位的位置（px 或 rows，行索引從 0 開始）。 默認值：{unit: 'px', value: 0}

• 示例: Scroll To

selectPage

• 參數: page

• 詳情:

  跳轉到指定 page。

• 示例: Select/Prev/Next Page

showAllColumns

• 參數: undefined

• 詳情:

  顯示所有列。

• 示例: Show/Hide All Columns

showColumn

• 參數: field

• 詳情:

  顯示指定 field 的列。 參數可以是字符串或數組。

• 示例: Show/Hide Column

showLoading

• 參數: undefined

• 詳情:

  顯示加載狀態。

• 示例: Show/Hide Loading

showRow

• 參數: params

• 詳情:

  顯示指定行。params 至少包含以下屬性之一：

  • index：行索引。
  • uniqueId：該行的 uniqueId 值。

• 示例: Show/Hide Row

sortBy

• 參數: params

• 詳情:

  按指定字段排序。params 至少包含以下屬性之一：

  • field：字段名。
  • sortOrder：排序順序，只能是 'asc' 或 'desc'。

• 示例: Sort By

sortReset

• 參數: undefined

• 詳情:

  重置表格的排序狀態，清除所有當前排序條件。無論是用戶點擊表頭觸發的排序，還是通過程序調用 sortBy 方法設置的排序，都會被重置為初始狀態。

• 示例: Sort reset

toggleDetailView

• 參數: index

• 詳情:

  如果啟用了詳情視圖（detail view）功能，將切換傳入 index 的行詳情視圖。

• 示例: Toggle Detail View

toggleFullscreen

• 參數: undefined

• 詳情:

  切換全屏顯示。

• 示例: Toggle Fullscreen

togglePagination

• 參數: undefined

• 詳情:

  切換分頁選項。

• 示例: Toggle Pagination

toggleView

• 參數: undefined

• 詳情:

  切換卡片視圖和表格視圖。

• 示例: Toggle View

uncheck

• 參數: index

• 詳情:

  取消選中指定索引的行。行索引從 0 開始計數。

• 示例: Check/Uncheck

uncheckAll

• 參數: undefined

• 詳情:

  取消選中當前頁的全部行。

• 示例: Check/Uncheck All

uncheckBy

• 參數: params

• 詳情:

  根據指定字段的值數組取消選中匹配的行，params 包含以下屬性：

  • field：用於查找和匹配記錄的字段名稱。
  • values：需要取消選中的行的字段值數組。
  • onlyCurrentPage（默認值：false）：若為 true，僅取消選中當前頁可見的數據；啟用分頁時會忽略其他頁的數據。

• 示例: Check/Uncheck By

updateByUniqueId

• 參數: params

• 詳情:

  更新指定行。params 包含以下屬性：

  • id：行 ID，應為表格中 uniqueId 字段的值。
  • row：新的行數據。
  • replace（可選）：設為 true 可替換整行，而非擴展。

• 示例: Update By Unique Id

updateCell

• 參數: params

• 詳情:

  更新單個單元格。params 包含以下屬性：

  • index：行索引。
  • field：字段名。
  • value：新的字段值。

  若要禁用表格重新初始化，可設置 {reinit: false}。

• 示例: Update Cell

updateCellByUniqueId

• 參數: params

• 詳情:

  更新指定單元格。params 包含以下屬性：

  • id：行 ID，應為表格中 uniqueId 字段的值。
  • field：需要更新的字段名。
  • value：新值。

  若要禁用表格重新初始化，可設置 {reinit: false}。

• 示例: Update Cell By Unique Id

updateColumnTitle

• 參數: params

• 詳情:

  更新列的標題。params 包含以下屬性：

  • field：字段名。
  • title：字段標題。

• 示例: Update Column Title

updateFormatText

• 參數: formatName, text

• 詳情:

  更新本地化格式文本。

• 示例: Update Format Text

updateRow

• 參數: params

• 詳情:

  更新指定行。params 包含以下屬性：

  • index：待更新的行索引。
  • row：新的行數據。
  • replace（可選）：設為 true 可替換整行，而非擴展。

• 示例: Update Row