table-options.md 13 KB

Table options []({{ site.repo }}/blob/master/docs/_i18n/{{ site.lang }}/documentation/table-options.md)


The table options is defined in jQuery.fn.bootstrapTable.defaults.

Name Attribute Type Default Description
- data-toggle String 'table' Activate bootstrap table without writing JavaScript.
classes data-classes String 'table table-hover' The class name of table.
height data-height Number undefined The height of table.
undefinedText data-undefined-text String '-' Defines the default undefined text.
striped data-striped Boolean false True to stripe the rows.
sortName data-sort-name String undefined Defines which column can be sorted.
sortOrder data-sort-order String 'asc' Defines the column sort order, can only be 'asc' or 'desc'.
iconsPrefix data-icons-prefix String 'glyphicon' Defines icon set name ('glyphicon' or 'fa' for FontAwesome). By default 'glyphicon' is used.
icons data-icons Object {
  refresh: 'glyphicon-refresh icon-refresh',
  toggle: 'glyphicon-list-alt icon-list-alt',
  columns: 'glyphicon-th icon-th'
}
Defines icons that used for refresh, toggle and columns buttons
columns - Array [] The table columns config object, see column properties for more details.
data - Array [] The data to be loaded.
method data-method String 'get' The method type to request remote data.
url data-url String undefined A URL to request data from remote site.
cache data-cache Boolean true False to disable caching of AJAX requests.
contentType data-content-type String 'application/json' The contentType of request remote data.
dataType data-data-type String 'json' The type of data that you are expecting back from the server.
ajaxOptions data-ajax-options Object {} Additional options for submit ajax request. List of values: http://api.jquery.com/jQuery.ajax.
queryParams data-query-params Function function(params) {
return params;
}
When requesting remote data, you can send additional parameters by modifying queryParams. If queryParamsType = 'limit', the params object contains:
limit, offset, search, sort, order Else, it contains:
pageSize, pageNumber, searchText, sortName, sortOrder.
Return false to stop request.
queryParamsType data-query-params-type String 'limit' Set 'limit' to send query params width RESTFul type.
responseHandler data-response-handler Function function(res) {
return res;
}
Before load remote data, handler the response data format, the parameters object contains:
res: the response data.
pagination data-pagination Boolean false True to show a pagination toolbar on table bottom.
sidePagination data-side-pagination String 'client' Defines the side pagination of table, can only be 'client' or 'server'.
pageNumber data-page-number Number 1 When set pagination property, initialize the page number.
pageSize data-page-size Number 10 When set pagination property, initialize the page size.
pageList data-page-list Array [10, 25, 50, 100, All] When set pagination property, initialize the page size selecting list. If you include the 'All' option, all the records will be shown in your table
selectItemName data-select-item-name String 'btSelectItem' The name of radio or checkbox input.
smartDisplay data-smart-display Boolean true True to display pagination or card view smartly.
search data-search Boolean false Enable the search input.
searchText data-search-text String '' When set search property, initialize the search text.
searchTimeOut data-search-time-out Number 500 Set timeout for search fire.
showHeader data-show-header Boolean true False to hide the table header.
showFooter data-show-footer Boolean false If true shows summary footer row
showColumns data-show-columns Boolean false True to show the columns drop down list.
showRefresh data-show-refresh Boolean false True to show the refresh button.
showToggle data-show-toggle Boolean false True to show the toggle button to toggle table / card view.
showPaginationSwitch data-show-pagination-switch Boolean false True to show the pagination switch button.
minimumCountColumns data-minimum-count-columns Number 1 The minimum count columns to hide of the columns drop down list.
idField data-id-field String undefined Indicate which field is an identity field.
cardView data-card-view Boolean false True to show card view table, for example mobile view.
searchAlign data-search-align String 'right' Indicate how to align the search input. 'left', 'right' can be used.
buttonsAlign data-buttons-align String 'right' Indicate how to align the toolbar buttons. 'left', 'right' can be used.
toolbarAlign data-toolbar-align String 'left' Indicate how to align the custom toolbar. 'left', 'right' can be used.
paginationHAlign data-pagination-h-align String 'right' Indicate how to align the pagination. 'left', 'right' can be used.
paginationDetailHAlign data-pagination-detail-h-align String 'left' Indicate how to align the pagination detail. 'left', 'right' can be used.
clickToSelect data-click-to-select Boolean false True to select checkbox or radiobox when click rows.
singleSelect data-single-select Boolean false True to allow checkbox selecting only one row.
toolbar data-toolbar String undefined A jQuery selector that indicate the toolbar, for example:
#toolbar, .toolbar.
checkboxHeader data-checkbox-header Boolean true False to hide check-all checkbox in header row.
maintainSelected data-maintain-selected Boolean false True to maintain selected rows on change page and search.
sortable data-sortable Boolean true False to disable sortable of all columns.
keyEvents data-key-events Boolean false True to enable the key events. For now when the user presses the "S" or "s" key the search button will be focused.
stateSave data-state-save Boolean false True to save the state of a table (its paging position, ordering state, records per page).
stateSaveExpire data-state-save-expire String '2h' You must set this property if stateSave is enable to know when will expire the cookie created. Must use this format: 'number{letter}' like '2h', in the letter position you can use: 's','mi','h','d','m','y', these means: 'seconds', 'minutes', 'hours', 'days', 'months', 'years'.
stateSaveIdTable data-state-save-id-table String '' You must set this property if stateSave is enable to sets an unique cookie with an identifier for each table in your page or project. You must set this property because we need create cookies with an identifier.
rowStyle data-row-style Function {} The row style formatter function, take two parameters:
row: the row record data.
index: the row index.
Support classes or css.
rowAttributes data-row-attributes Function {} The row attribute formatter function, take two parameters:
row: the row record data.
index: the row index.
Support all custom attributes.