UNPKG

89.7 kBJavaScriptView Raw
1/**
2 * @author zhixin wen <wenzhixin2010@gmail.com>
3 * version: 1.15.5
4 * https://github.com/wenzhixin/bootstrap-table/
5 */
6
7import Constants from './constants/index.js'
8import Utils from './utils/index.js'
9import VirtualScroll from './virtual-scroll/index.js'
10
11class BootstrapTable {
12 constructor (el, options) {
13 this.options = options
14 this.$el = $(el)
15 this.$el_ = this.$el.clone()
16 this.timeoutId_ = 0
17 this.timeoutFooter_ = 0
18
19 this.init()
20 }
21
22 init () {
23 this.initConstants()
24 this.initLocale()
25 this.initContainer()
26 this.initTable()
27 this.initHeader()
28 this.initData()
29 this.initHiddenRows()
30 this.initToolbar()
31 this.initPagination()
32 this.initBody()
33 this.initSearchText()
34 this.initServer()
35 }
36
37 initConstants () {
38 const o = this.options
39 this.constants = Constants.CONSTANTS
40 this.constants.theme = $.fn.bootstrapTable.theme
41
42 const buttonsPrefix = o.buttonsPrefix ? `${o.buttonsPrefix}-` : ''
43 this.constants.buttonsClass = [
44 o.buttonsPrefix,
45 buttonsPrefix + o.buttonsClass,
46 Utils.sprintf(`${buttonsPrefix}%s`, o.iconSize)
47 ].join(' ').trim()
48 }
49
50 initLocale () {
51 if (this.options.locale) {
52 const locales = $.fn.bootstrapTable.locales
53 const parts = this.options.locale.split(/-|_/)
54
55 parts[0] = parts[0].toLowerCase()
56 if (parts[1]) {
57 parts[1] = parts[1].toUpperCase()
58 }
59
60 if (locales[this.options.locale]) {
61 $.extend(this.options, locales[this.options.locale])
62 } else if (locales[parts.join('-')]) {
63 $.extend(this.options, locales[parts.join('-')])
64 } else if (locales[parts[0]]) {
65 $.extend(this.options, locales[parts[0]])
66 }
67 }
68 }
69
70 initContainer () {
71 const topPagination = ['top', 'both'].includes(this.options.paginationVAlign)
72 ? '<div class="fixed-table-pagination clearfix"></div>' : ''
73 const bottomPagination = ['bottom', 'both'].includes(this.options.paginationVAlign)
74 ? '<div class="fixed-table-pagination"></div>' : ''
75
76 this.$container = $(`
77 <div class="bootstrap-table ${this.constants.theme}">
78 <div class="fixed-table-toolbar"></div>
79 ${topPagination}
80 <div class="fixed-table-container">
81 <div class="fixed-table-header"><table></table></div>
82 <div class="fixed-table-body">
83 <div class="fixed-table-loading">
84 <span class="loading-wrap">
85 <span class="loading-text">${this.options.formatLoadingMessage()}</span>
86 <span class="animation-wrap"><span class="animation-dot"></span></span>
87 </span>
88 </div>
89 </div>
90 <div class="fixed-table-footer"><table><thead><tr></tr></thead></table></div>
91 </div>
92 ${bottomPagination}
93 </div>
94 `)
95
96 this.$container.insertAfter(this.$el)
97 this.$tableContainer = this.$container.find('.fixed-table-container')
98 this.$tableHeader = this.$container.find('.fixed-table-header')
99 this.$tableBody = this.$container.find('.fixed-table-body')
100 this.$tableLoading = this.$container.find('.fixed-table-loading')
101 this.$tableFooter = this.$el.find('tfoot')
102 // checking if custom table-toolbar exists or not
103 if (this.options.buttonsToolbar) {
104 this.$toolbar = $('body').find(this.options.buttonsToolbar)
105 } else {
106 this.$toolbar = this.$container.find('.fixed-table-toolbar')
107 }
108 this.$pagination = this.$container.find('.fixed-table-pagination')
109
110 this.$tableBody.append(this.$el)
111 this.$container.after('<div class="clearfix"></div>')
112
113 this.$el.addClass(this.options.classes)
114 this.$tableLoading.addClass(this.options.classes)
115
116 if (this.options.height) {
117 this.$tableContainer.addClass('fixed-height')
118
119 if (this.options.showFooter) {
120 this.$tableContainer.addClass('has-footer')
121 }
122
123 if (this.options.classes.split(' ').includes('table-bordered')) {
124 this.$tableBody.append('<div class="fixed-table-border"></div>')
125 this.$tableBorder = this.$tableBody.find('.fixed-table-border')
126 this.$tableLoading.addClass('fixed-table-border')
127 }
128
129 this.$tableFooter = this.$container.find('.fixed-table-footer')
130 } else {
131 if (!this.$tableFooter.length) {
132 this.$el.append('<tfoot><tr></tr></tfoot>')
133 this.$tableFooter = this.$el.find('tfoot')
134 }
135 }
136 }
137
138 initTable () {
139 const columns = []
140 const data = []
141
142 this.$header = this.$el.find('>thead')
143 if (!this.$header.length) {
144 this.$header = $(`<thead class="${this.options.theadClasses}"></thead>`).appendTo(this.$el)
145 } else if (this.options.theadClasses) {
146 this.$header.addClass(this.options.theadClasses)
147 }
148 this.$header.find('tr').each((i, el) => {
149 const column = []
150
151 $(el).find('th').each((i, el) => {
152 // #2014: getFieldIndex and elsewhere assume this is string, causes issues if not
153 if (typeof $(el).data('field') !== 'undefined') {
154 $(el).data('field', `${$(el).data('field')}`)
155 }
156 column.push($.extend({}, {
157 title: $(el).html(),
158 'class': $(el).attr('class'),
159 titleTooltip: $(el).attr('title'),
160 rowspan: $(el).attr('rowspan') ? +$(el).attr('rowspan') : undefined,
161 colspan: $(el).attr('colspan') ? +$(el).attr('colspan') : undefined
162 }, $(el).data()))
163 })
164 columns.push(column)
165 })
166
167 if (!Array.isArray(this.options.columns[0])) {
168 this.options.columns = [this.options.columns]
169 }
170
171 this.options.columns = $.extend(true, [], columns, this.options.columns)
172 this.columns = []
173 this.fieldsColumnsIndex = []
174
175 Utils.setFieldIndex(this.options.columns)
176
177 this.options.columns.forEach((columns, i) => {
178 columns.forEach((_column, j) => {
179 const column = $.extend({}, BootstrapTable.COLUMN_DEFAULTS, _column)
180
181 if (typeof column.fieldIndex !== 'undefined') {
182 this.columns[column.fieldIndex] = column
183 this.fieldsColumnsIndex[column.field] = column.fieldIndex
184 }
185
186 this.options.columns[i][j] = column
187 })
188 })
189
190 // if options.data is setting, do not process tbody and tfoot data
191 if (!this.options.data.length) {
192 this.options.data = Utils.trToData(this.columns, this.$el.find('>tbody>tr'))
193 if (data.length) {
194 this.fromHtml = true
195 }
196 }
197
198 this.footerData = Utils.trToData(this.columns, this.$el.find('>tfoot>tr'))
199 if (this.footerData) {
200 this.$el.find('tfoot').html('<tr></tr>')
201 }
202
203 if (!this.options.showFooter || this.options.cardView) {
204 this.$tableFooter.hide()
205 } else {
206 this.$tableFooter.show()
207 }
208 }
209
210 initHeader () {
211 const visibleColumns = {}
212 const html = []
213
214 this.header = {
215 fields: [],
216 styles: [],
217 classes: [],
218 formatters: [],
219 detailFormatters: [],
220 events: [],
221 sorters: [],
222 sortNames: [],
223 cellStyles: [],
224 searchables: []
225 }
226
227 Utils.updateFieldGroup(this.options.columns)
228
229 this.options.columns.forEach((columns, i) => {
230 html.push('<tr>')
231
232 if (i === 0 && !this.options.cardView && this.options.detailView && this.options.detailViewIcon) {
233 html.push(`<th class="detail" rowspan="${this.options.columns.length}">
234 <div class="fht-cell"></div>
235 </th>
236 `)
237 }
238
239 columns.forEach((column, j) => {
240 const class_ = Utils.sprintf(' class="%s"', column['class'])
241 const unitWidth = column.widthUnit
242 const width = parseFloat(column.width)
243
244 const halign = Utils.sprintf('text-align: %s; ', column.halign ? column.halign : column.align)
245 const align = Utils.sprintf('text-align: %s; ', column.align)
246 let style = Utils.sprintf('vertical-align: %s; ', column.valign)
247 style += Utils.sprintf('width: %s; ', (column.checkbox || column.radio) && !width
248 ? (!column.showSelectTitle ? '36px' : undefined)
249 : (width ? width + unitWidth : undefined))
250
251 if (typeof column.fieldIndex === 'undefined' && !column.visible) {
252 return
253 }
254
255 if (typeof column.fieldIndex !== 'undefined') {
256 this.header.fields[column.fieldIndex] = column.field
257 this.header.styles[column.fieldIndex] = align + style
258 this.header.classes[column.fieldIndex] = class_
259 this.header.formatters[column.fieldIndex] = column.formatter
260 this.header.detailFormatters[column.fieldIndex] = column.detailFormatter
261 this.header.events[column.fieldIndex] = column.events
262 this.header.sorters[column.fieldIndex] = column.sorter
263 this.header.sortNames[column.fieldIndex] = column.sortName
264 this.header.cellStyles[column.fieldIndex] = column.cellStyle
265 this.header.searchables[column.fieldIndex] = column.searchable
266
267 if (!column.visible) {
268 return
269 }
270
271 if (this.options.cardView && (!column.cardVisible)) {
272 return
273 }
274
275 visibleColumns[column.field] = column
276 }
277
278 html.push(`<th${Utils.sprintf(' title="%s"', column.titleTooltip)}`,
279 column.checkbox || column.radio
280 ? Utils.sprintf(' class="bs-checkbox %s"', column['class'] || '')
281 : class_,
282 Utils.sprintf(' style="%s"', halign + style),
283 Utils.sprintf(' rowspan="%s"', column.rowspan),
284 Utils.sprintf(' colspan="%s"', column.colspan),
285 Utils.sprintf(' data-field="%s"', column.field),
286 // If `column` is not the first element of `this.options.columns[0]`, then className 'data-not-first-th' should be added.
287 j === 0 && i > 0 ? ' data-not-first-th' : '',
288 '>')
289
290 html.push(Utils.sprintf('<div class="th-inner %s">', this.options.sortable && column.sortable
291 ? 'sortable both' : ''))
292
293 let text = this.options.escape ? Utils.escapeHTML(column.title) : column.title
294
295 const title = text
296 if (column.checkbox) {
297 text = ''
298 if (!this.options.singleSelect && this.options.checkboxHeader) {
299 text = '<label><input name="btSelectAll" type="checkbox" /><span></span></label>'
300 }
301 this.header.stateField = column.field
302 }
303 if (column.radio) {
304 text = ''
305 this.header.stateField = column.field
306 this.options.singleSelect = true
307 }
308 if (!text && column.showSelectTitle) {
309 text += title
310 }
311
312 html.push(text)
313 html.push('</div>')
314 html.push('<div class="fht-cell"></div>')
315 html.push('</div>')
316 html.push('</th>')
317 })
318 html.push('</tr>')
319 })
320
321 this.$header.html(html.join(''))
322 this.$header.find('th[data-field]').each((i, el) => {
323 $(el).data(visibleColumns[$(el).data('field')])
324 })
325 this.$container.off('click', '.th-inner').on('click', '.th-inner', e => {
326 const $this = $(e.currentTarget)
327
328 if (this.options.detailView && !$this.parent().hasClass('bs-checkbox')) {
329 if ($this.closest('.bootstrap-table')[0] !== this.$container[0]) {
330 return false
331 }
332 }
333
334 if (this.options.sortable && $this.parent().data().sortable) {
335 this.onSort(e)
336 }
337 })
338
339 this.$header.children().children().off('keypress').on('keypress', e => {
340 if (this.options.sortable && $(e.currentTarget).data().sortable) {
341 const code = e.keyCode || e.which
342 if (code === 13) { // Enter keycode
343 this.onSort(e)
344 }
345 }
346 })
347
348 const resizeEvent = `resize.bootstrap-table${this.$el.attr('id') || ''}`
349 $(window).off(resizeEvent)
350 if (!this.options.showHeader || this.options.cardView) {
351 this.$header.hide()
352 this.$tableHeader.hide()
353 this.$tableLoading.css('top', 0)
354 } else {
355 this.$header.show()
356 this.$tableHeader.show()
357 this.$tableLoading.css('top', this.$header.outerHeight() + 1)
358 // Assign the correct sortable arrow
359 this.getCaret()
360 $(window).on(resizeEvent, e => this.resetWidth(e))
361 }
362
363 this.$selectAll = this.$header.find('[name="btSelectAll"]')
364 this.$selectAll.off('click').on('click', ({currentTarget}) => {
365 const checked = $(currentTarget).prop('checked')
366 this[checked ? 'checkAll' : 'uncheckAll']()
367 this.updateSelected()
368 })
369 }
370
371 initData (data, type) {
372 if (type === 'append') {
373 this.options.data = this.options.data.concat(data)
374 } else if (type === 'prepend') {
375 this.options.data = [].concat(data).concat(this.options.data)
376 } else {
377 this.options.data = data || this.options.data
378 }
379
380 this.data = this.options.data
381
382 if (this.options.sidePagination === 'server') {
383 return
384 }
385 this.initSort()
386 }
387
388 initSort () {
389 let name = this.options.sortName
390 const order = this.options.sortOrder === 'desc' ? -1 : 1
391 const index = this.header.fields.indexOf(this.options.sortName)
392 let timeoutId = 0
393
394 if (index !== -1) {
395 if (this.options.sortStable) {
396 this.data.forEach((row, i) => {
397 if (!row.hasOwnProperty('_position')) {
398 row._position = i
399 }
400 })
401 }
402
403 if (this.options.customSort) {
404 Utils.calculateObjectValue(this.options, this.options.customSort, [
405 this.options.sortName,
406 this.options.sortOrder,
407 this.data
408 ])
409 } else {
410 this.data.sort((a, b) => {
411 if (this.header.sortNames[index]) {
412 name = this.header.sortNames[index]
413 }
414 const aa = Utils.getItemField(a, name, this.options.escape)
415 const bb = Utils.getItemField(b, name, this.options.escape)
416 const value = Utils.calculateObjectValue(this.header, this.header.sorters[index], [aa, bb, a, b])
417
418 if (value !== undefined) {
419 if (this.options.sortStable && value === 0) {
420 return order * (a._position - b._position)
421 }
422 return order * value
423 }
424
425 return Utils.sort(aa, bb, order, this.options.sortStable)
426 })
427 }
428
429 if (this.options.sortClass !== undefined) {
430 clearTimeout(timeoutId)
431 timeoutId = setTimeout(() => {
432 this.$el.removeClass(this.options.sortClass)
433 const index = this.$header.find(`[data-field="${this.options.sortName}"]`).index()
434 this.$el.find(`tr td:nth-child(${index + 1})`).addClass(this.options.sortClass)
435 }, 250)
436 }
437 }
438 }
439
440 onSort ({type, currentTarget}) {
441 const $this = type === 'keypress' ? $(currentTarget) : $(currentTarget).parent()
442 const $this_ = this.$header.find('th').eq($this.index())
443
444 this.$header.add(this.$header_).find('span.order').remove()
445
446 if (this.options.sortName === $this.data('field')) {
447 this.options.sortOrder = this.options.sortOrder === 'asc' ? 'desc' : 'asc'
448 } else {
449 this.options.sortName = $this.data('field')
450 if (this.options.rememberOrder) {
451 this.options.sortOrder = $this.data('order') === 'asc' ? 'desc' : 'asc'
452 } else {
453 this.options.sortOrder = this.columns[this.fieldsColumnsIndex[$this.data('field')]].sortOrder ||
454 this.columns[this.fieldsColumnsIndex[$this.data('field')]].order
455 }
456 }
457 this.trigger('sort', this.options.sortName, this.options.sortOrder)
458
459 $this.add($this_).data('order', this.options.sortOrder)
460
461 // Assign the correct sortable arrow
462 this.getCaret()
463
464 if (this.options.sidePagination === 'server') {
465 this.options.pageNumber = 1
466 this.initServer(this.options.silentSort)
467 return
468 }
469
470 this.initSort()
471 this.initBody()
472 }
473
474 initToolbar () {
475 const o = this.options
476 let html = []
477 let timeoutId = 0
478 let $keepOpen
479 let $search
480 let switchableCount = 0
481
482 if (this.$toolbar.find('.bs-bars').children().length) {
483 $('body').append($(o.toolbar))
484 }
485 this.$toolbar.html('')
486
487 if (typeof o.toolbar === 'string' || typeof o.toolbar === 'object') {
488 $(Utils.sprintf('<div class="bs-bars %s-%s"></div>', this.constants.classes.pull, o.toolbarAlign))
489 .appendTo(this.$toolbar)
490 .append($(o.toolbar))
491 }
492
493 // showColumns, showToggle, showRefresh
494 html = [`<div class="${[
495 'columns',
496 `columns-${o.buttonsAlign}`,
497 this.constants.classes.buttonsGroup,
498 `${this.constants.classes.pull}-${o.buttonsAlign}`
499 ].join(' ')}">`]
500
501 if (typeof o.icons === 'string') {
502 o.icons = Utils.calculateObjectValue(null, o.icons)
503 }
504
505 if (o.showPaginationSwitch) {
506 html.push(`<button class="${this.constants.buttonsClass}" type="button" name="paginationSwitch"
507 aria-label="Pagination Switch" title="${o.formatPaginationSwitch()}">
508 ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.paginationSwitchDown) : ''}
509 ${o.showButtonText ? o.formatPaginationSwitchUp() : ''}
510 </button>`)
511 }
512
513 if (o.showRefresh) {
514 html.push(`<button class="${this.constants.buttonsClass}" type="button" name="refresh"
515 aria-label="Refresh" title="${o.formatRefresh()}">
516 ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.refresh) : ''}
517 ${o.showButtonText ? o.formatRefresh() : ''}
518 </button>`)
519 }
520
521 if (o.showToggle) {
522 html.push(`<button class="${this.constants.buttonsClass}" type="button" name="toggle"
523 aria-label="Toggle" title="${o.formatToggle()}">
524 ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.toggleOff) : '' }
525 ${o.showButtonText ? o.formatToggleOn() : ''}
526 </button>`)
527 }
528
529 if (o.showFullscreen) {
530 html.push(`<button class="${this.constants.buttonsClass}" type="button" name="fullscreen"
531 aria-label="Fullscreen" title="${o.formatFullscreen()}">
532 ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.fullscreen) : '' }
533 ${o.showButtonText ? o.formatFullscreen() : ''}
534 </button>`)
535 }
536
537 if (o.showColumns) {
538 html.push(`<div class="keep-open ${this.constants.classes.buttonsDropdown}" title="${o.formatColumns()}">
539 <button class="${this.constants.buttonsClass} dropdown-toggle" type="button" data-toggle="dropdown"
540 aria-label="Columns" title="${o.formatColumns()}">
541 ${o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.columns) : '' }
542 ${o.showButtonText ? o.formatColumns() : ''}
543 ${this.constants.html.dropdownCaret}
544 </button>
545 ${this.constants.html.toolbarDropdown[0]}`)
546
547 if (o.showColumnsToggleAll) {
548 const allFieldsVisible = this.getVisibleColumns().length === this.columns.length
549 html.push(
550 Utils.sprintf(this.constants.html.toolbarDropdownItem,
551 Utils.sprintf('<input type="checkbox" class="toggle-all" %s> <span>%s</span>', allFieldsVisible ? 'checked="checked"' : '', o.formatColumnsToggleAll())
552 )
553 )
554
555 html.push(this.constants.html.toolbarDropdownSeparator)
556 }
557
558 this.columns.forEach((column, i) => {
559 if (column.radio || column.checkbox) {
560 return
561 }
562
563 if (o.cardView && !column.cardVisible) {
564 return
565 }
566
567 const checked = column.visible ? ' checked="checked"' : ''
568
569 if (column.switchable) {
570 html.push(Utils.sprintf(this.constants.html.toolbarDropdownItem,
571 Utils.sprintf('<input type="checkbox" data-field="%s" value="%s"%s> <span>%s</span>',
572 column.field, i, checked, column.title)))
573 switchableCount++
574 }
575 })
576 html.push(this.constants.html.toolbarDropdown[1], '</div>')
577 }
578
579 html.push('</div>')
580
581 // Fix #188: this.showToolbar is for extensions
582 if (this.showToolbar || html.length > 2) {
583 this.$toolbar.append(html.join(''))
584 }
585
586 if (o.showPaginationSwitch) {
587 this.$toolbar.find('button[name="paginationSwitch"]')
588 .off('click').on('click', () => this.togglePagination())
589 }
590
591 if (o.showFullscreen) {
592 this.$toolbar.find('button[name="fullscreen"]')
593 .off('click').on('click', () => this.toggleFullscreen())
594 }
595
596 if (o.showRefresh) {
597 this.$toolbar.find('button[name="refresh"]')
598 .off('click').on('click', () => this.refresh())
599 }
600
601 if (o.showToggle) {
602 this.$toolbar.find('button[name="toggle"]')
603 .off('click').on('click', () => {
604 this.toggleView()
605 })
606 }
607
608 if (o.showColumns) {
609 $keepOpen = this.$toolbar.find('.keep-open')
610 const $checkboxes = $keepOpen.find('input:not(".toggle-all")')
611 const $toggleAll = $keepOpen.find('input.toggle-all')
612
613 if (switchableCount <= o.minimumCountColumns) {
614 $keepOpen.find('input').prop('disabled', true)
615 }
616
617 $keepOpen.find('li, label').off('click').on('click', e => {
618 e.stopImmediatePropagation()
619 })
620
621 $checkboxes.off('click').on('click', ({currentTarget}) => {
622 const $this = $(currentTarget)
623
624 this._toggleColumn($this.val(), $this.prop('checked'), false)
625 this.trigger('column-switch', $this.data('field'), $this.prop('checked'))
626 $toggleAll.prop('checked', $checkboxes.filter(':checked').length === this.columns.length)
627 })
628
629 $toggleAll.off('click').on('click', ({currentTarget}) => {
630 this._toggleAllColumns($(currentTarget).prop('checked'))
631 })
632 }
633
634 // Fix #4516: this.showSearchClearButton is for extensions
635 if (o.search || this.showSearchClearButton) {
636 html = []
637 const showSearchButton = Utils.sprintf(this.constants.html.searchButton,
638 this.constants.buttonsClass,
639 o.formatSearch(),
640 o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.search) : '',
641 o.showButtonText ? o.formatSearch() : ''
642 )
643 const showSearchClearButton = Utils.sprintf(this.constants.html.searchClearButton,
644 this.constants.buttonsClass,
645 o.formatClearSearch(),
646 o.showButtonIcons ? Utils.sprintf(this.constants.html.icon, o.iconsPrefix, o.icons.clearSearch) : '',
647 o.showButtonText ? o.formatClearSearch() : ''
648 )
649 const searchInputHtml = `<input class="${this.constants.classes.input}
650 ${Utils.sprintf(' %s%s', this.constants.classes.inputPrefix, o.iconSize)}
651 search-input" type="text" placeholder="${o.formatSearch()}">`
652 let searchInputFinalHtml = searchInputHtml
653
654 if (o.showSearchButton || o.showSearchClearButton) {
655 const buttonsHtml = (o.showSearchButton ? showSearchButton : '') +
656 (o.showSearchClearButton ? showSearchClearButton : '')
657
658 searchInputFinalHtml = o.search ? Utils.sprintf(this.constants.html.inputGroup,
659 searchInputHtml, buttonsHtml) : buttonsHtml
660 }
661
662 html.push(Utils.sprintf(`
663 <div class="${this.constants.classes.pull}-${o.searchAlign} search ${this.constants.classes.inputGroup}">
664 %s
665 </div>
666 `, searchInputFinalHtml))
667
668 this.$toolbar.append(html.join(''))
669 const $searchInput = this.$toolbar.find('.search input')
670 const handleInputEvent = () => {
671 const eventTriggers = Utils.isIEBrowser() ? 'mouseup' : 'keyup drop blur'
672 $searchInput.off(eventTriggers).on(eventTriggers, event => {
673 if (o.searchOnEnterKey && event.keyCode !== 13) {
674 return
675 }
676
677 if ([37, 38, 39, 40].includes(event.keyCode)) {
678 return
679 }
680
681 clearTimeout(timeoutId) // doesn't matter if it's 0
682 timeoutId = setTimeout(() => {
683 this.onSearch(event)
684 }, o.searchTimeOut)
685 })
686 }
687
688 if (o.showSearchButton) {
689 this.$toolbar.find('.search button[name=search]').off('click').on('click', event => {
690 clearTimeout(timeoutId) // doesn't matter if it's 0
691 timeoutId = setTimeout(() => {
692 this.onSearch({currentTarget: $searchInput})
693 }, o.searchTimeOut)
694 })
695
696 if (o.searchOnEnterKey) {
697 handleInputEvent()
698 }
699 } else {
700 handleInputEvent()
701 }
702
703 if (o.showSearchClearButton) {
704 this.$toolbar.find('.search button[name=clearSearch]').click(() => {
705 this.resetSearch()
706 })
707 }
708 }
709 }
710
711 onSearch ({currentTarget, firedByInitSearchText} = {}, overwriteSearchText = true) {
712 if (currentTarget !== undefined && $(currentTarget).length && overwriteSearchText) {
713 const text = $(currentTarget).val().trim()
714
715 if (this.options.trimOnSearch && $(currentTarget).val() !== text) {
716 $(currentTarget).val(text)
717 }
718
719 if (this.searchText === text) {
720 return
721 }
722
723 if ($(currentTarget).hasClass('search-input')) {
724 this.searchText = text
725 this.options.searchText = text
726 }
727 }
728
729 if (!firedByInitSearchText) {
730 this.options.pageNumber = 1
731 }
732 this.initSearch()
733 if (firedByInitSearchText) {
734 if (this.options.sidePagination === 'client') {
735 this.updatePagination()
736 }
737 } else {
738 this.updatePagination()
739 }
740 this.trigger('search', this.searchText)
741 }
742
743 initSearch () {
744 this.filterOptions = this.filterOptions || this.options.filterOptions
745 if (this.options.sidePagination !== 'server') {
746 if (this.options.customSearch) {
747 this.data = Utils.calculateObjectValue(this.options, this.options.customSearch,
748 [this.options.data, this.searchText, this.filterColumns])
749 return
750 }
751
752 const s = this.searchText && (this.options.escape
753 ? Utils.escapeHTML(this.searchText) : this.searchText).toLowerCase()
754 const f = Utils.isEmptyObject(this.filterColumns) ? null : this.filterColumns
755
756 // Check filter
757 if (typeof this.filterOptions.filterAlgorithm === 'function') {
758 this.data = this.options.data.filter((item, i) => this.filterOptions.filterAlgorithm.apply(null, [item, f]))
759 } else if (typeof this.filterOptions.filterAlgorithm === 'string') {
760 this.data = f ? this.options.data.filter((item, i) => {
761 const filterAlgorithm = this.filterOptions.filterAlgorithm
762 if (filterAlgorithm === 'and') {
763 for (const key in f) {
764 if (
765 (Array.isArray(f[key]) &&
766 !f[key].includes(item[key])) ||
767 (!Array.isArray(f[key]) &&
768 item[key] !== f[key])
769 ) {
770 return false
771 }
772 }
773 } else if (filterAlgorithm === 'or') {
774 let match = false
775 for (const key in f) {
776 if (
777 (Array.isArray(f[key]) &&
778 f[key].includes(item[key])) ||
779 (!Array.isArray(f[key]) &&
780 item[key] === f[key])
781 ) {
782 match = true
783 }
784 }
785
786 return match
787 }
788
789 return true
790 }) : this.options.data
791 }
792
793 const visibleFields = this.getVisibleFields()
794 this.data = s ? this.data.filter((item, i) => {
795 for (let j = 0; j < this.header.fields.length; j++) {
796 if (!this.header.searchables[j] || (this.options.visibleSearch && visibleFields.indexOf(this.header.fields[j]) === -1)) {
797 continue
798 }
799
800 const key = Utils.isNumeric(this.header.fields[j]) ? parseInt(this.header.fields[j], 10) : this.header.fields[j]
801 const column = this.columns[this.fieldsColumnsIndex[key]]
802 let value
803
804 if (typeof key === 'string') {
805 value = item
806 const props = key.split('.')
807 for (let i = 0; i < props.length; i++) {
808 if (value[props[i]] !== null) {
809 value = value[props[i]]
810 }
811 }
812 } else {
813 value = item[key]
814 }
815
816 // Fix #142: respect searchFormatter boolean
817 if (column && column.searchFormatter) {
818 value = Utils.calculateObjectValue(column,
819 this.header.formatters[j], [value, item, i, column.field], value)
820 }
821
822 if (typeof value === 'string' || typeof value === 'number') {
823 if (this.options.strictSearch) {
824 if ((`${value}`).toLowerCase() === s) {
825 return true
826 }
827 } else {
828 const largerSmallerEqualsRegex = /(?:(<=|=>|=<|>=|>|<)(?:\s+)?(\d+)?|(\d+)?(\s+)?(<=|=>|=<|>=|>|<))/gm
829 const matches = largerSmallerEqualsRegex.exec(s)
830 let comparisonCheck = false
831
832 if (matches) {
833 const operator = matches[1] || `${matches[5]}l`
834 const comparisonValue = matches[2] || matches[3]
835 const int = parseInt(value, 10)
836 const comparisonInt = parseInt(comparisonValue, 10)
837
838 switch (operator) {
839 case '>':
840 case '<l':
841 comparisonCheck = int > comparisonInt
842 break
843 case '<':
844 case '>l':
845 comparisonCheck = int < comparisonInt
846 break
847 case '<=':
848 case '=<':
849 case '>=l':
850 case '=>l':
851 comparisonCheck = int <= comparisonInt
852 break
853 case '>=':
854 case '=>':
855 case '<=l':
856 case '=<l':
857 comparisonCheck = int >= comparisonInt
858 break
859 default:
860 break
861 }
862 }
863
864 if (comparisonCheck || (`${value}`).toLowerCase().includes(s)) {
865 return true
866 }
867 }
868 }
869 }
870 return false
871 }) : this.data
872 }
873 }
874
875 initPagination () {
876 const o = this.options
877 if (!o.pagination) {
878 this.$pagination.hide()
879 return
880 }
881 this.$pagination.show()
882
883 const html = []
884 let $allSelected = false
885 let i
886 let from
887 let to
888 let $pageList
889 let $pre
890 let $next
891 let $number
892 const data = this.getData({includeHiddenRows: false})
893 let pageList = o.pageList
894
895 if (o.sidePagination !== 'server') {
896 o.totalRows = data.length
897 }
898
899 this.totalPages = 0
900 if (o.totalRows) {
901 if (o.pageSize === o.formatAllRows()) {
902 o.pageSize = o.totalRows
903 $allSelected = true
904 } else if (o.pageSize === o.totalRows) {
905 // Fix #667 Table with pagination,
906 // multiple pages and a search this matches to one page throws exception
907 const pageLst = typeof o.pageList === 'string'
908 ? o.pageList.replace('[', '').replace(']', '')
909 .replace(/ /g, '').toLowerCase().split(',') : o.pageList
910 if (pageLst.includes(o.formatAllRows().toLowerCase())) {
911 $allSelected = true
912 }
913 }
914
915 this.totalPages = ~~((o.totalRows - 1) / o.pageSize) + 1
916
917 o.totalPages = this.totalPages
918 }
919 if (this.totalPages > 0 && o.pageNumber > this.totalPages) {
920 o.pageNumber = this.totalPages
921 }
922
923 this.pageFrom = (o.pageNumber - 1) * o.pageSize + 1
924 this.pageTo = o.pageNumber * o.pageSize
925 if (this.pageTo > o.totalRows) {
926 this.pageTo = o.totalRows
927 }
928
929 if (this.options.pagination && this.options.sidePagination !== 'server') {
930 this.options.totalNotFiltered = this.options.data.length
931 }
932
933 if (!this.options.showExtendedPagination) {
934 this.options.totalNotFiltered = undefined
935 }
936
937 const paginationInfo = o.onlyInfoPagination ?
938 o.formatDetailPagination(o.totalRows) :
939 o.formatShowingRows(this.pageFrom, this.pageTo, o.totalRows, o.totalNotFiltered)
940
941 html.push(`<div class="${this.constants.classes.pull}-${o.paginationDetailHAlign} pagination-detail">
942 <span class="pagination-info">
943 ${paginationInfo}
944 </span>`)
945
946 if (!o.onlyInfoPagination) {
947 html.push('<span class="page-list">')
948
949 const pageNumber = [
950 `<span class="${this.constants.classes.paginationDropdown}">
951 <button class="${this.constants.buttonsClass} dropdown-toggle" type="button" data-toggle="dropdown">
952 <span class="page-size">
953 ${$allSelected ? o.formatAllRows() : o.pageSize}
954 </span>
955 ${this.constants.html.dropdownCaret}
956 </button>
957 ${this.constants.html.pageDropdown[0]}`]
958
959 if (typeof o.pageList === 'string') {
960 const list = o.pageList.replace('[', '').replace(']', '')
961 .replace(/ /g, '').split(',')
962
963 pageList = []
964 for (const value of list) {
965 pageList.push(
966 (value.toLowerCase() === o.formatAllRows().toLowerCase() ||
967 ['all', 'unlimited'].includes(value.toLowerCase()))
968 ? o.formatAllRows() : +value)
969 }
970 }
971
972 pageList.forEach((page, i) => {
973 if (!o.smartDisplay || i === 0 || pageList[i - 1] < o.totalRows) {
974 let active
975 if ($allSelected) {
976 active = page === o.formatAllRows() ? this.constants.classes.dropdownActive : ''
977 } else {
978 active = page === o.pageSize ? this.constants.classes.dropdownActive : ''
979 }
980 pageNumber.push(Utils.sprintf(this.constants.html.pageDropdownItem, active, page))
981 }
982 })
983 pageNumber.push(`${this.constants.html.pageDropdown[1]}</span>`)
984
985 html.push(o.formatRecordsPerPage(pageNumber.join('')))
986 html.push('</span></div>')
987
988 html.push(`<div class="${this.constants.classes.pull}-${o.paginationHAlign} pagination">`,
989 Utils.sprintf(this.constants.html.pagination[0], Utils.sprintf(' pagination-%s', o.iconSize)),
990 Utils.sprintf(this.constants.html.paginationItem, ' page-pre', o.formatSRPaginationPreText(), o.paginationPreText))
991
992 if (this.totalPages < o.paginationSuccessivelySize) {
993 from = 1
994 to = this.totalPages
995 } else {
996 from = o.pageNumber - o.paginationPagesBySide
997 to = from + (o.paginationPagesBySide * 2)
998 }
999
1000 if (o.pageNumber < (o.paginationSuccessivelySize - 1)) {
1001 to = o.paginationSuccessivelySize
1002 }
1003
1004 if (o.paginationSuccessivelySize > this.totalPages - from) {
1005 from = from - (o.paginationSuccessivelySize - (this.totalPages - from)) + 1
1006 }
1007
1008 if (from < 1) {
1009 from = 1
1010 }
1011
1012 if (to > this.totalPages) {
1013 to = this.totalPages
1014 }
1015
1016 const middleSize = Math.round(o.paginationPagesBySide / 2)
1017 const pageItem = (i, classes = '') => Utils.sprintf(this.constants.html.paginationItem,
1018 classes + (i === o.pageNumber ? ` ${this.constants.classes.paginationActive}` : ''), o.formatSRPaginationPageText(i), i)
1019
1020 if (from > 1) {
1021 let max = o.paginationPagesBySide
1022 if (max >= from) max = from - 1
1023 for (i = 1; i <= max; i++) {
1024 html.push(pageItem(i))
1025 }
1026 if ((from - 1) === max + 1) {
1027 i = from - 1
1028 html.push(pageItem(i))
1029 } else {
1030 if ((from - 1) > max) {
1031 if (
1032 (from - o.paginationPagesBySide * 2) > o.paginationPagesBySide &&
1033 o.paginationUseIntermediate
1034 ) {
1035 i = Math.round(((from - middleSize) / 2) + middleSize)
1036 html.push(pageItem(i, ' page-intermediate'))
1037 } else {
1038 html.push(Utils.sprintf(this.constants.html.paginationItem,
1039 ' page-first-separator disabled', '', '...'))
1040 }
1041 }
1042 }
1043 }
1044
1045 for (i = from; i <= to; i++) {
1046 html.push(pageItem(i))
1047 }
1048
1049 if (this.totalPages > to) {
1050 let min = this.totalPages - (o.paginationPagesBySide - 1)
1051 if (to >= min) min = to + 1
1052 if ((to + 1) === min - 1) {
1053 i = to + 1
1054 html.push(pageItem(i))
1055 } else {
1056 if (min > (to + 1)) {
1057 if (
1058 (this.totalPages - to) > o.paginationPagesBySide * 2 &&
1059 o.paginationUseIntermediate
1060 ) {
1061 i = Math.round(((this.totalPages - middleSize - to) / 2) + to)
1062 html.push(pageItem(i, ' page-intermediate'))
1063 } else {
1064 html.push(Utils.sprintf(this.constants.html.paginationItem,
1065 ' page-last-separator disabled', '', '...'))
1066 }
1067 }
1068 }
1069
1070 for (i = min; i <= this.totalPages; i++) {
1071 html.push(pageItem(i))
1072 }
1073 }
1074
1075 html.push(Utils.sprintf(this.constants.html.paginationItem, ' page-next', o.formatSRPaginationNextText(), o.paginationNextText))
1076 html.push(this.constants.html.pagination[1], '</div>')
1077 }
1078 this.$pagination.html(html.join(''))
1079
1080 const dropupClass = ['bottom', 'both'].includes(o.paginationVAlign) ?
1081 ` ${this.constants.classes.dropup}` : ''
1082 this.$pagination.last().find('.page-list > span').addClass(dropupClass)
1083
1084 if (!o.onlyInfoPagination) {
1085 $pageList = this.$pagination.find('.page-list a')
1086 $pre = this.$pagination.find('.page-pre')
1087 $next = this.$pagination.find('.page-next')
1088 $number = this.$pagination.find('.page-item').not('.page-next, .page-pre, .page-last-separator, .page-first-separator')
1089
1090 if (this.totalPages <= 1) {
1091 this.$pagination.find('div.pagination').hide()
1092 }
1093
1094 if (o.smartDisplay) {
1095 if (pageList.length < 2 || o.totalRows <= pageList[0]) {
1096 this.$pagination.find('span.page-list').hide()
1097 }
1098 }
1099
1100 // when data is empty, hide the pagination
1101 this.$pagination[this.getData().length ? 'show' : 'hide']()
1102
1103 if (!o.paginationLoop) {
1104 if (o.pageNumber === 1) {
1105 $pre.addClass('disabled')
1106 }
1107 if (o.pageNumber === this.totalPages) {
1108 $next.addClass('disabled')
1109 }
1110 }
1111
1112 if ($allSelected) {
1113 o.pageSize = o.formatAllRows()
1114 }
1115 // removed the events for last and first, onPageNumber executeds the same logic
1116 $pageList.off('click').on('click', e => this.onPageListChange(e))
1117 $pre.off('click').on('click', e => this.onPagePre(e))
1118 $next.off('click').on('click', e => this.onPageNext(e))
1119 $number.off('click').on('click', e => this.onPageNumber(e))
1120 }
1121 }
1122
1123 updatePagination (event) {
1124 // Fix #171: IE disabled button can be clicked bug.
1125 if (event && $(event.currentTarget).hasClass('disabled')) {
1126 return
1127 }
1128
1129 if (!this.options.maintainMetaData) {
1130 this.resetRows()
1131 }
1132
1133 this.initPagination()
1134 if (this.options.sidePagination === 'server') {
1135 this.initServer()
1136 } else {
1137 this.initBody()
1138 }
1139
1140 this.trigger('page-change', this.options.pageNumber, this.options.pageSize)
1141 }
1142
1143 onPageListChange (event) {
1144 event.preventDefault()
1145 const $this = $(event.currentTarget)
1146
1147 $this.parent().addClass(this.constants.classes.dropdownActive)
1148 .siblings().removeClass(this.constants.classes.dropdownActive)
1149 this.options.pageSize = $this.text().toUpperCase() === this.options.formatAllRows().toUpperCase()
1150 ? this.options.formatAllRows() : +$this.text()
1151 this.$toolbar.find('.page-size').text(this.options.pageSize)
1152
1153 this.updatePagination(event)
1154 return false
1155 }
1156
1157 onPagePre (event) {
1158 event.preventDefault()
1159 if ((this.options.pageNumber - 1) === 0) {
1160 this.options.pageNumber = this.options.totalPages
1161 } else {
1162 this.options.pageNumber--
1163 }
1164 this.updatePagination(event)
1165 return false
1166 }
1167
1168 onPageNext (event) {
1169 event.preventDefault()
1170 if ((this.options.pageNumber + 1) > this.options.totalPages) {
1171 this.options.pageNumber = 1
1172 } else {
1173 this.options.pageNumber++
1174 }
1175 this.updatePagination(event)
1176 return false
1177 }
1178
1179 onPageNumber (event) {
1180 event.preventDefault()
1181 if (this.options.pageNumber === +$(event.currentTarget).text()) {
1182 return
1183 }
1184 this.options.pageNumber = +$(event.currentTarget).text()
1185 this.updatePagination(event)
1186 return false
1187 }
1188
1189 initRow (item, i, data, trFragments) {
1190 const html = []
1191 let style = {}
1192 const csses = []
1193 let data_ = ''
1194 let attributes = {}
1195 const htmlAttributes = []
1196
1197 if (Utils.findIndex(this.hiddenRows, item) > -1) {
1198 return
1199 }
1200
1201 style = Utils.calculateObjectValue(this.options, this.options.rowStyle, [item, i], style)
1202
1203 if (style && style.css) {
1204 for (const [key, value] of Object.entries(style.css)) {
1205 csses.push(`${key}: ${value}`)
1206 }
1207 }
1208
1209 attributes = Utils.calculateObjectValue(this.options,
1210 this.options.rowAttributes, [item, i], attributes)
1211
1212 if (attributes) {
1213 for (const [key, value] of Object.entries(attributes)) {
1214 htmlAttributes.push(`${key}="${Utils.escapeHTML(value)}"`)
1215 }
1216 }
1217
1218 if (item._data && !Utils.isEmptyObject(item._data)) {
1219 for (const [k, v] of Object.entries(item._data)) {
1220 // ignore data-index
1221 if (k === 'index') {
1222 return
1223 }
1224 data_ += ` data-${k}='${typeof v === 'object' ? JSON.stringify(v) : v}'`
1225 }
1226 }
1227
1228 html.push('<tr',
1229 Utils.sprintf(' %s', htmlAttributes.length ? htmlAttributes.join(' ') : undefined),
1230 Utils.sprintf(' id="%s"', Array.isArray(item) ? undefined : item._id),
1231 Utils.sprintf(' class="%s"', style.classes || (Array.isArray(item) ? undefined : item._class)),
1232 ` data-index="${i}"`,
1233 Utils.sprintf(' data-uniqueid="%s"', Utils.getItemField(item, this.options.uniqueId, false)),
1234 Utils.sprintf(' data-has-detail-view="%s"', (!this.options.cardView && this.options.detailView && Utils.calculateObjectValue(null, this.options.detailFilter, [i, item])) ? 'true' : undefined),
1235 Utils.sprintf('%s', data_),
1236 '>'
1237 )
1238
1239 if (this.options.cardView) {
1240 html.push(`<td colspan="${this.header.fields.length}"><div class="card-views">`)
1241 }
1242
1243 if (!this.options.cardView && this.options.detailView && this.options.detailViewIcon) {
1244 html.push('<td>')
1245
1246 if (Utils.calculateObjectValue(null, this.options.detailFilter, [i, item])) {
1247 html.push(`
1248 <a class="detail-icon" href="#">
1249 ${Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, this.options.icons.detailOpen)}
1250 </a>
1251 `)
1252 }
1253
1254 html.push('</td>')
1255 }
1256
1257 this.header.fields.forEach((field, j) => {
1258 let text = ''
1259 let value_ = Utils.getItemField(item, field, this.options.escape)
1260 let value = ''
1261 let type = ''
1262 let cellStyle = {}
1263 let id_ = ''
1264 let class_ = this.header.classes[j]
1265 let style_ = ''
1266 let data_ = ''
1267 let rowspan_ = ''
1268 let colspan_ = ''
1269 let title_ = ''
1270 const column = this.columns[j]
1271
1272 if (this.fromHtml && typeof value_ === 'undefined') {
1273 if ((!column.checkbox) && (!column.radio)) {
1274 return
1275 }
1276 }
1277
1278 if (!column.visible) {
1279 return
1280 }
1281
1282 if (this.options.cardView && (!column.cardVisible)) {
1283 return
1284 }
1285
1286 if (column.escape) {
1287 value_ = Utils.escapeHTML(value_)
1288 }
1289
1290 if (csses.concat([this.header.styles[j]]).length) {
1291 style_ = ` style="${csses.concat([this.header.styles[j]]).join('; ')}"`
1292 }
1293 // handle td's id and class
1294 if (item[`_${field}_id`]) {
1295 id_ = Utils.sprintf(' id="%s"', item[`_${field}_id`])
1296 }
1297 if (item[`_${field}_class`]) {
1298 class_ = Utils.sprintf(' class="%s"', item[`_${field}_class`])
1299 }
1300 if (item[`_${field}_rowspan`]) {
1301 rowspan_ = Utils.sprintf(' rowspan="%s"', item[`_${field}_rowspan`])
1302 }
1303 if (item[`_${field}_colspan`]) {
1304 colspan_ = Utils.sprintf(' colspan="%s"', item[`_${field}_colspan`])
1305 }
1306 if (item[`_${field}_title`]) {
1307 title_ = Utils.sprintf(' title="%s"', item[`_${field}_title`])
1308 }
1309 cellStyle = Utils.calculateObjectValue(this.header,
1310 this.header.cellStyles[j], [value_, item, i, field], cellStyle)
1311 if (cellStyle.classes) {
1312 class_ = ` class="${cellStyle.classes}"`
1313 }
1314 if (cellStyle.css) {
1315 const csses_ = []
1316 for (const [key, value] of Object.entries(cellStyle.css)) {
1317 csses_.push(`${key}: ${value}`)
1318 }
1319 style_ = ` style="${csses_.concat(this.header.styles[j]).join('; ')}"`
1320 }
1321
1322 value = Utils.calculateObjectValue(column,
1323 this.header.formatters[j], [value_, item, i, field], value_)
1324
1325 if (item[`_${field}_data`] && !Utils.isEmptyObject(item[`_${field}_data`])) {
1326 for (const [k, v] of Object.entries(item[`_${field}_data`])) {
1327 // ignore data-index
1328 if (k === 'index') {
1329 return
1330 }
1331 data_ += ` data-${k}="${v}"`
1332 }
1333 }
1334
1335 if (column.checkbox || column.radio) {
1336 type = column.checkbox ? 'checkbox' : type
1337 type = column.radio ? 'radio' : type
1338
1339 const c = column['class'] || ''
1340 const isChecked = (value === true || value_ || (value && value.checked)) && value !== false
1341 const isDisabled = !column.checkboxEnabled || (value && value.disabled)
1342
1343 text = [
1344 this.options.cardView
1345 ? `<div class="card-view ${c}">`
1346 : `<td class="bs-checkbox ${c}"${class_}${style_}>`,
1347 `<label>
1348 <input
1349 data-index="${i}"
1350 name="${this.options.selectItemName}"
1351 type="${type}"
1352 ${Utils.sprintf('value="%s"', item[this.options.idField])}
1353 ${Utils.sprintf('checked="%s"', isChecked ? 'checked' : undefined)}
1354 ${Utils.sprintf('disabled="%s"', isDisabled ? 'disabled' : undefined)} />
1355 <span></span>
1356 </label>`,
1357 this.header.formatters[j] && typeof value === 'string' ? value : '',
1358 this.options.cardView ? '</div>' : '</td>'
1359 ].join('')
1360
1361 item[this.header.stateField] = value === true || (!!value_ || (value && value.checked))
1362 } else {
1363 value = typeof value === 'undefined' || value === null
1364 ? this.options.undefinedText : value
1365
1366 if (this.options.cardView) {
1367 const cardTitle = this.options.showHeader
1368 ? `<span class="card-view-title"${style_}>${Utils.getFieldTitle(this.columns, field)}</span>` : ''
1369
1370 text = `<div class="card-view">${cardTitle}<span class="card-view-value">${value}</span></div>`
1371
1372 if (this.options.smartDisplay && value === '') {
1373 text = '<div class="card-view"></div>'
1374 }
1375 } else {
1376 text = `<td${id_}${class_}${style_}${data_}${rowspan_}${colspan_}${title_}>${value}</td>`
1377 }
1378 }
1379
1380 html.push(text)
1381 })
1382
1383 if (this.options.cardView) {
1384 html.push('</div></td>')
1385 }
1386 html.push('</tr>')
1387
1388 return html.join('')
1389 }
1390
1391 initBody (fixedScroll) {
1392 const data = this.getData()
1393
1394 this.trigger('pre-body', data)
1395
1396 this.$body = this.$el.find('>tbody')
1397 if (!this.$body.length) {
1398 this.$body = $('<tbody></tbody>').appendTo(this.$el)
1399 }
1400
1401 // Fix #389 Bootstrap-table-flatJSON is not working
1402 if (!this.options.pagination || this.options.sidePagination === 'server') {
1403 this.pageFrom = 1
1404 this.pageTo = data.length
1405 }
1406
1407 const rows = []
1408 const trFragments = $(document.createDocumentFragment())
1409 let hasTr = false
1410
1411 for (let i = this.pageFrom - 1; i < this.pageTo; i++) {
1412 const item = data[i]
1413 const tr = this.initRow(item, i, data, trFragments)
1414 hasTr = hasTr || !!tr
1415 if (tr && typeof tr === 'string') {
1416 if (!this.options.virtualScroll) {
1417 trFragments.append(tr)
1418 } else {
1419 rows.push(tr)
1420 }
1421 }
1422 }
1423
1424 // show no records
1425 if (!hasTr) {
1426 this.$body.html(`<tr class="no-records-found">${Utils.sprintf('<td colspan="%s">%s</td>',
1427 this.$header.find('th').length,
1428 this.options.formatNoMatches())}</tr>`)
1429 } else {
1430 if (!this.options.virtualScroll) {
1431 this.$body.html(trFragments)
1432 } else {
1433 if (this.virtualScroll) {
1434 this.virtualScroll.destroy()
1435 }
1436 this.virtualScroll = new VirtualScroll({
1437 rows,
1438 fixedScroll,
1439 scrollEl: this.$tableBody[0],
1440 contentEl: this.$body[0],
1441 itemHeight: this.options.virtualScrollItemHeight,
1442 callback: () => {
1443 this.fitHeader()
1444 this.initBodyEvent()
1445 }
1446 })
1447 }
1448 }
1449
1450 if (!fixedScroll) {
1451 this.scrollTo(0)
1452 }
1453
1454 this.initBodyEvent()
1455 this.updateSelected()
1456 this.initFooter()
1457 this.resetView()
1458
1459 if (this.options.sidePagination !== 'server') {
1460 this.options.totalRows = data.length
1461 }
1462
1463 this.trigger('post-body', data)
1464 }
1465
1466 initBodyEvent () {
1467 // click to select by column
1468 this.$body.find('> tr[data-index] > td').off('click dblclick').on('click dblclick', e => {
1469 const $td = $(e.currentTarget)
1470 const $tr = $td.parent()
1471 const $cardViewArr = $(e.target).parents('.card-views').children()
1472 const $cardViewTarget = $(e.target).parents('.card-view')
1473 const rowIndex = $tr.data('index')
1474 const item = this.data[rowIndex]
1475 const index = this.options.cardView ? $cardViewArr.index($cardViewTarget) : $td[0].cellIndex
1476 const fields = this.getVisibleFields()
1477 const field = fields[this.options.detailView && this.options.detailViewIcon && !this.options.cardView ? index - 1 : index]
1478 const column = this.columns[this.fieldsColumnsIndex[field]]
1479 const value = Utils.getItemField(item, field, this.options.escape)
1480
1481 if ($td.find('.detail-icon').length) {
1482 return
1483 }
1484
1485 this.trigger(e.type === 'click' ? 'click-cell' : 'dbl-click-cell', field, value, item, $td)
1486 this.trigger(e.type === 'click' ? 'click-row' : 'dbl-click-row', item, $tr, field)
1487
1488 // if click to select - then trigger the checkbox/radio click
1489 if (
1490 e.type === 'click' &&
1491 this.options.clickToSelect &&
1492 column.clickToSelect &&
1493 !Utils.calculateObjectValue(this.options, this.options.ignoreClickToSelectOn, [e.target])
1494 ) {
1495 const $selectItem = $tr.find(Utils.sprintf('[name="%s"]', this.options.selectItemName))
1496 if ($selectItem.length) {
1497 $selectItem[0].click()
1498 }
1499 }
1500
1501 if (e.type === 'click' && this.options.detailViewByClick) {
1502 this.toggleDetailView(rowIndex, this.header.detailFormatters[this.fieldsColumnsIndex[field]])
1503 }
1504 }).off('mousedown').on('mousedown', e => {
1505 // https://github.com/jquery/jquery/issues/1741
1506 this.multipleSelectRowCtrlKey = e.ctrlKey || e.metaKey
1507 this.multipleSelectRowShiftKey = e.shiftKey
1508 })
1509
1510 this.$body.find('> tr[data-index] > td > .detail-icon').off('click').on('click', e => {
1511 e.preventDefault()
1512 this.toggleDetailView($(e.currentTarget).parent().parent().data('index'))
1513 return false
1514 })
1515
1516 this.$selectItem = this.$body.find(Utils.sprintf('[name="%s"]', this.options.selectItemName))
1517 this.$selectItem.off('click').on('click', e => {
1518 e.stopImmediatePropagation()
1519
1520 const $this = $(e.currentTarget)
1521 this._toggleCheck($this.prop('checked'), $this.data('index'))
1522 })
1523
1524 this.header.events.forEach((_events, i) => {
1525 let events = _events
1526 if (!events) {
1527 return
1528 }
1529 // fix bug, if events is defined with namespace
1530 if (typeof events === 'string') {
1531 events = Utils.calculateObjectValue(null, events)
1532 }
1533
1534 const field = this.header.fields[i]
1535 let fieldIndex = this.getVisibleFields().indexOf(field)
1536
1537 if (fieldIndex === -1) {
1538 return
1539 }
1540
1541 if (this.options.detailView && !this.options.cardView) {
1542 fieldIndex += 1
1543 }
1544
1545 for (const key in events) {
1546 if (!events.hasOwnProperty(key)) {
1547 continue
1548 }
1549 const event = events[key]
1550 this.$body.find('>tr:not(.no-records-found)').each((i, tr) => {
1551 const $tr = $(tr)
1552 const $td = $tr.find(this.options.cardView ? '.card-views>.card-view' : '>td').eq(fieldIndex)
1553 const index = key.indexOf(' ')
1554 const name = key.substring(0, index)
1555 const el = key.substring(index + 1)
1556
1557 $td.find(el).off(name).on(name, e => {
1558 const index = $tr.data('index')
1559 const row = this.data[index]
1560 const value = row[field]
1561
1562 event.apply(this, [e, value, row, index])
1563 })
1564 })
1565 }
1566 })
1567 }
1568
1569 initServer (silent, query, url) {
1570 let data = {}
1571 const index = this.header.fields.indexOf(this.options.sortName)
1572
1573 let params = {
1574 searchText: this.searchText,
1575 sortName: this.options.sortName,
1576 sortOrder: this.options.sortOrder
1577 }
1578
1579 if (this.header.sortNames[index]) {
1580 params.sortName = this.header.sortNames[index]
1581 }
1582
1583 if (this.options.pagination && this.options.sidePagination === 'server') {
1584 params.pageSize = this.options.pageSize === this.options.formatAllRows()
1585 ? this.options.totalRows : this.options.pageSize
1586 params.pageNumber = this.options.pageNumber
1587 }
1588
1589 if (!(url || this.options.url) && !this.options.ajax) {
1590 return
1591 }
1592
1593 if (this.options.queryParamsType === 'limit') {
1594 params = {
1595 search: params.searchText,
1596 sort: params.sortName,
1597 order: params.sortOrder
1598 }
1599
1600 if (this.options.pagination && this.options.sidePagination === 'server') {
1601 params.offset = this.options.pageSize === this.options.formatAllRows()
1602 ? 0 : this.options.pageSize * (this.options.pageNumber - 1)
1603 params.limit = this.options.pageSize === this.options.formatAllRows()
1604 ? this.options.totalRows : this.options.pageSize
1605 if (params.limit === 0) {
1606 delete params.limit
1607 }
1608 }
1609 }
1610
1611 if (!(Utils.isEmptyObject(this.filterColumnsPartial))) {
1612 params.filter = JSON.stringify(this.filterColumnsPartial, null)
1613 }
1614
1615 $.extend(params, query || {})
1616
1617 data = Utils.calculateObjectValue(this.options, this.options.queryParams, [params], data)
1618
1619 // false to stop request
1620 if (data === false) {
1621 return
1622 }
1623
1624 if (!silent) {
1625 this.showLoading()
1626 }
1627 const request = $.extend({}, Utils.calculateObjectValue(null, this.options.ajaxOptions), {
1628 type: this.options.method,
1629 url: url || this.options.url,
1630 data: this.options.contentType === 'application/json' && this.options.method === 'post'
1631 ? JSON.stringify(data) : data,
1632 cache: this.options.cache,
1633 contentType: this.options.contentType,
1634 dataType: this.options.dataType,
1635 success: (_res, textStatus, jqXHR) => {
1636 const res = Utils.calculateObjectValue(this.options,
1637 this.options.responseHandler, [_res, jqXHR], _res)
1638
1639 this.load(res)
1640 this.trigger('load-success', res, jqXHR.status, jqXHR)
1641 if (!silent) {
1642 this.hideLoading()
1643 }
1644 },
1645 error: jqXHR => {
1646 let data = []
1647 if (this.options.sidePagination === 'server') {
1648 data = {}
1649 data[this.options.totalField] = 0
1650 data[this.options.dataField] = []
1651 }
1652 this.load(data)
1653 this.trigger('load-error', jqXHR.status, jqXHR)
1654 if (!silent) this.$tableLoading.hide()
1655 }
1656 })
1657
1658 if (this.options.ajax) {
1659 Utils.calculateObjectValue(this, this.options.ajax, [request], null)
1660 } else {
1661 if (this._xhr && this._xhr.readyState !== 4) {
1662 this._xhr.abort()
1663 }
1664 this._xhr = $.ajax(request)
1665 }
1666
1667 return data
1668 }
1669
1670 initSearchText () {
1671 if (this.options.search) {
1672 this.searchText = ''
1673 if (this.options.searchText !== '') {
1674 const $search = this.$toolbar.find('.search input')
1675 $search.val(this.options.searchText)
1676 this.onSearch({currentTarget: $search, firedByInitSearchText: true})
1677 }
1678 }
1679 }
1680
1681 getCaret () {
1682 this.$header.find('th').each((i, th) => {
1683 $(th).find('.sortable').removeClass('desc asc')
1684 .addClass($(th).data('field') === this.options.sortName
1685 ? this.options.sortOrder : 'both')
1686 })
1687 }
1688
1689 updateSelected () {
1690 const checkAll = this.$selectItem.filter(':enabled').length &&
1691 this.$selectItem.filter(':enabled').length ===
1692 this.$selectItem.filter(':enabled').filter(':checked').length
1693
1694 this.$selectAll.add(this.$selectAll_).prop('checked', checkAll)
1695
1696 this.$selectItem.each((i, el) => {
1697 $(el).closest('tr')[$(el).prop('checked') ? 'addClass' : 'removeClass']('selected')
1698 })
1699 }
1700
1701 updateRows () {
1702 this.$selectItem.each((i, el) => {
1703 this.data[$(el).data('index')][this.header.stateField] = $(el).prop('checked')
1704 })
1705 }
1706
1707 resetRows () {
1708 for (const row of this.data) {
1709 this.$selectAll.prop('checked', false)
1710 this.$selectItem.prop('checked', false)
1711 if (this.header.stateField) {
1712 row[this.header.stateField] = false
1713 }
1714 }
1715 this.initHiddenRows()
1716 }
1717
1718 trigger (_name, ...args) {
1719 const name = `${_name}.bs.table`
1720 this.options[BootstrapTable.EVENTS[name]](...args)
1721 this.$el.trigger($.Event(name), args)
1722
1723 this.options.onAll(name, args)
1724 this.$el.trigger($.Event('all.bs.table'), [name, args])
1725 }
1726
1727 resetHeader () {
1728 // fix #61: the hidden table reset header bug.
1729 // fix bug: get $el.css('width') error sometime (height = 500)
1730 clearTimeout(this.timeoutId_)
1731 this.timeoutId_ = setTimeout(() => this.fitHeader(), this.$el.is(':hidden') ? 100 : 0)
1732 }
1733
1734 fitHeader () {
1735 if (this.$el.is(':hidden')) {
1736 this.timeoutId_ = setTimeout(() => this.fitHeader(), 100)
1737 return
1738 }
1739
1740 const fixedBody = this.$tableBody.get(0)
1741 const scrollWidth = fixedBody.scrollWidth > fixedBody.clientWidth &&
1742 fixedBody.scrollHeight > fixedBody.clientHeight + this.$header.outerHeight()
1743 ? Utils.getScrollBarWidth() : 0
1744
1745 this.$el.css('margin-top', -this.$header.outerHeight())
1746
1747 const focused = $(':focus')
1748 if (focused.length > 0) {
1749 const $th = focused.parents('th')
1750 if ($th.length > 0) {
1751 const dataField = $th.attr('data-field')
1752 if (dataField !== undefined) {
1753 const $headerTh = this.$header.find(`[data-field='${dataField}']`)
1754 if ($headerTh.length > 0) {
1755 $headerTh.find(':input').addClass('focus-temp')
1756 }
1757 }
1758 }
1759 }
1760
1761 this.$header_ = this.$header.clone(true, true)
1762 this.$selectAll_ = this.$header_.find('[name="btSelectAll"]')
1763 this.$tableHeader
1764 .css('margin-right', scrollWidth)
1765 .find('table').css('width', this.$el.outerWidth())
1766 .html('').attr('class', this.$el.attr('class'))
1767 .append(this.$header_)
1768
1769 this.$tableLoading.css('width', this.$el.outerWidth())
1770
1771 const focusedTemp = $('.focus-temp:visible:eq(0)')
1772 if (focusedTemp.length > 0) {
1773 focusedTemp.focus()
1774 this.$header.find('.focus-temp').removeClass('focus-temp')
1775 }
1776
1777 // fix bug: $.data() is not working as expected after $.append()
1778 this.$header.find('th[data-field]').each((i, el) => {
1779 this.$header_.find(Utils.sprintf('th[data-field="%s"]', $(el).data('field'))).data($(el).data())
1780 })
1781
1782 const visibleFields = this.getVisibleFields()
1783 const $ths = this.$header_.find('th')
1784 let $tr = this.$body.find('>tr:not(.no-records-found,.virtual-scroll-top)').eq(0)
1785
1786 while ($tr.length && $tr.find('>td[colspan]:not([colspan="1"])').length) {
1787 $tr = $tr.next()
1788 }
1789
1790 $tr.find('> *').each((i, el) => {
1791 const $this = $(el)
1792 let index = i
1793
1794 if (this.options.detailView && this.options.detailViewIcon && !this.options.cardView) {
1795 if (i === 0) {
1796 const $thDetail = $ths.filter('.detail')
1797 const zoomWidth = $thDetail.innerWidth() - $thDetail.find('.fht-cell').width()
1798 $thDetail.find('.fht-cell').width($this.innerWidth() - zoomWidth)
1799 }
1800 index = i - 1
1801 }
1802
1803 if (index === -1) {
1804 return
1805 }
1806
1807 let $th = this.$header_.find(Utils.sprintf('th[data-field="%s"]', visibleFields[index]))
1808 if ($th.length > 1) {
1809 $th = $($ths[$this[0].cellIndex])
1810 }
1811
1812 const zoomWidth = $th.innerWidth() - $th.find('.fht-cell').width()
1813 $th.find('.fht-cell').width($this.innerWidth() - zoomWidth)
1814 })
1815
1816 this.horizontalScroll()
1817 this.trigger('post-header')
1818 }
1819
1820 initFooter () {
1821 if (!this.options.showFooter || this.options.cardView) { // do nothing
1822 return
1823 }
1824
1825 const data = this.getData()
1826 const html = []
1827
1828 if (!this.options.cardView && this.options.detailView && this.options.detailViewIcon) {
1829 html.push('<th class="detail"><div class="th-inner"></div><div class="fht-cell"></div></th>')
1830 }
1831
1832 for (const column of this.columns) {
1833 let falign = ''
1834
1835 let valign = ''
1836 const csses = []
1837 let style = {}
1838 let class_ = Utils.sprintf(' class="%s"', column['class'])
1839
1840 if (!column.visible) {
1841 continue
1842 }
1843
1844 if (this.options.cardView && (!column.cardVisible)) {
1845 return
1846 }
1847
1848 falign = Utils.sprintf('text-align: %s; ', column.falign ? column.falign : column.align)
1849 valign = Utils.sprintf('vertical-align: %s; ', column.valign)
1850
1851 style = Utils.calculateObjectValue(null, this.options.footerStyle, [column])
1852
1853 if (style && style.css) {
1854 for (const [key, value] of Object.entries(style.css)) {
1855 csses.push(`${key}: ${value}`)
1856 }
1857 }
1858 if (style && style.classes) {
1859 class_ = Utils.sprintf(' class="%s"', column['class'] ?
1860 [column['class'], style.classes].join(' ') : style.classes)
1861 }
1862
1863 html.push('<th', class_, Utils.sprintf(' style="%s"', falign + valign + csses.concat().join('; ')), '>')
1864 html.push('<div class="th-inner">')
1865
1866 html.push(Utils.calculateObjectValue(column, column.footerFormatter,
1867 [data], this.footerData[0] && this.footerData[0][column.field] || ''))
1868
1869 html.push('</div>')
1870 html.push('<div class="fht-cell"></div>')
1871 html.push('</div>')
1872 html.push('</th>')
1873 }
1874
1875 this.$tableFooter.find('tr').html(html.join(''))
1876
1877 this.trigger('post-footer', this.$tableFooter)
1878 }
1879
1880 fitFooter () {
1881 if (this.$el.is(':hidden')) {
1882 setTimeout(() => this.fitFooter(), 100)
1883 return
1884 }
1885
1886 const fixedBody = this.$tableBody.get(0)
1887 const scrollWidth = fixedBody.scrollWidth > fixedBody.clientWidth &&
1888 fixedBody.scrollHeight > fixedBody.clientHeight + this.$header.outerHeight()
1889 ? Utils.getScrollBarWidth() : 0
1890
1891 this.$tableFooter
1892 .css('margin-right', scrollWidth)
1893 .find('table').css('width', this.$el.outerWidth())
1894 .attr('class', this.$el.attr('class'))
1895
1896 const visibleFields = this.getVisibleFields()
1897 const $ths = this.$tableFooter.find('th')
1898 let $tr = this.$body.find('>tr:first-child:not(.no-records-found)')
1899
1900 while ($tr.length && $tr.find('>td[colspan]:not([colspan="1"])').length) {
1901 $tr = $tr.next()
1902 }
1903
1904 $tr.find('> *').each((i, el) => {
1905 const $this = $(el)
1906 let index = i
1907
1908 if (this.options.detailView && !this.options.cardView) {
1909 if (i === 0) {
1910 const $thDetail = $ths.filter('.detail')
1911 const zoomWidth = $thDetail.innerWidth() - $thDetail.find('.fht-cell').width()
1912 $thDetail.find('.fht-cell').width($this.innerWidth() - zoomWidth)
1913 }
1914 index = i - 1
1915 }
1916
1917 if (index === -1) {
1918 return
1919 }
1920
1921 const $th = $ths.eq(i)
1922 const zoomWidth = $th.innerWidth() - $th.find('.fht-cell').width()
1923 $th.find('.fht-cell').width($this.innerWidth() - zoomWidth)
1924 })
1925
1926 this.horizontalScroll()
1927 }
1928
1929 horizontalScroll () {
1930 // horizontal scroll event
1931 // TODO: it's probably better improving the layout than binding to scroll event
1932 this.$tableBody.off('scroll').on('scroll', ({currentTarget}) => {
1933 if (this.options.showHeader && this.options.height) {
1934 this.$tableHeader.scrollLeft($(currentTarget).scrollLeft())
1935 }
1936
1937 if (this.options.showFooter && !this.options.cardView) {
1938 this.$tableFooter.scrollLeft($(currentTarget).scrollLeft())
1939 }
1940
1941 this.trigger('scroll-body', $(currentTarget))
1942 })
1943 }
1944
1945 getVisibleFields () {
1946 const visibleFields = []
1947
1948 for (const field of this.header.fields) {
1949 const column = this.columns[this.fieldsColumnsIndex[field]]
1950
1951 if (!column || !column.visible) {
1952 continue
1953 }
1954 visibleFields.push(field)
1955 }
1956 return visibleFields
1957 }
1958
1959 initHiddenRows () {
1960 this.hiddenRows = []
1961 }
1962
1963 // PUBLIC FUNCTION DEFINITION
1964 // =======================
1965
1966 getOptions () {
1967 // deep copy and remove data
1968 const options = $.extend({}, this.options)
1969 delete options.data
1970 return $.extend(true, {}, options)
1971 }
1972
1973 refreshOptions (options) {
1974 // If the objects are equivalent then avoid the call of destroy / init methods
1975 if (Utils.compareObjects(this.options, options, true)) {
1976 return
1977 }
1978 this.options = $.extend(this.options, options)
1979 this.trigger('refresh-options', this.options)
1980 this.destroy()
1981 this.init()
1982 }
1983
1984 getData (params) {
1985 let data = this.options.data
1986 if (this.searchText || this.options.sortName || !Utils.isEmptyObject(this.filterColumns) || !Utils.isEmptyObject(this.filterColumnsPartial)) {
1987 data = this.data
1988 }
1989
1990 if (params && params.useCurrentPage) {
1991 data = data.slice(this.pageFrom - 1, this.pageTo)
1992 }
1993
1994 if (params && !params.includeHiddenRows) {
1995 const hiddenRows = this.getHiddenRows()
1996 data = data.filter(function (row) {
1997 return Utils.findIndex(hiddenRows, row) === -1
1998 })
1999 }
2000
2001 return data
2002 }
2003
2004 getSelections () {
2005 // fix #2424: from html with checkbox
2006 return this.data.filter(row => row[this.header.stateField] === true)
2007 }
2008
2009 getAllSelections () {
2010 return this.options.data.filter(row => row[this.header.stateField] === true)
2011 }
2012
2013 load (_data) {
2014 let fixedScroll = false
2015 let data = _data
2016
2017 // #431: support pagination
2018 if (this.options.pagination && this.options.sidePagination === 'server') {
2019 this.options.totalRows = data[this.options.totalField]
2020 }
2021
2022 if (this.options.pagination && this.options.sidePagination === 'server') {
2023 this.options.totalNotFiltered = data[this.options.totalNotFilteredField]
2024 }
2025
2026 fixedScroll = data.fixedScroll
2027 data = Array.isArray(data) ? data : data[this.options.dataField]
2028
2029 this.initData(data)
2030 this.initSearch()
2031 this.initPagination()
2032 this.initBody(fixedScroll)
2033 }
2034
2035 append (data) {
2036 this.initData(data, 'append')
2037 this.initSearch()
2038 this.initPagination()
2039 this.initSort()
2040 this.initBody(true)
2041 }
2042
2043 prepend (data) {
2044 this.initData(data, 'prepend')
2045 this.initSearch()
2046 this.initPagination()
2047 this.initSort()
2048 this.initBody(true)
2049 }
2050
2051 remove (params) {
2052 const len = this.options.data.length
2053 let i
2054 let row
2055
2056 if (!params.hasOwnProperty('field') || !params.hasOwnProperty('values')) {
2057 return
2058 }
2059
2060 for (i = len - 1; i >= 0; i--) {
2061 row = this.options.data[i]
2062
2063 if (!row.hasOwnProperty(params.field)) {
2064 continue
2065 }
2066 if (params.values.includes(row[params.field])) {
2067 this.options.data.splice(i, 1)
2068 if (this.options.sidePagination === 'server') {
2069 this.options.totalRows -= 1
2070 }
2071 }
2072 }
2073
2074 if (len === this.options.data.length) {
2075 return
2076 }
2077
2078 this.initSearch()
2079 this.initPagination()
2080 this.initSort()
2081 this.initBody(true)
2082 }
2083
2084 removeAll () {
2085 if (this.options.data.length > 0) {
2086 this.options.data.splice(0, this.options.data.length)
2087 this.initSearch()
2088 this.initPagination()
2089 this.initBody(true)
2090 }
2091 }
2092
2093 insertRow (params) {
2094 if (!params.hasOwnProperty('index') || !params.hasOwnProperty('row')) {
2095 return
2096 }
2097 this.options.data.splice(params.index, 0, params.row)
2098 this.initSearch()
2099 this.initPagination()
2100 this.initSort()
2101 this.initBody(true)
2102 }
2103
2104 updateRow (params) {
2105 const allParams = Array.isArray(params) ? params : [params]
2106
2107 for (const params of allParams) {
2108 if (!params.hasOwnProperty('index') || !params.hasOwnProperty('row')) {
2109 continue
2110 }
2111
2112 $.extend(this.options.data[params.index], params.row)
2113 if (params.hasOwnProperty('replace') && params.replace) {
2114 this.options.data[params.index] = params.row
2115 } else {
2116 $.extend(this.options.data[params.index], params.row)
2117 }
2118 }
2119
2120 this.initSearch()
2121 this.initPagination()
2122 this.initSort()
2123 this.initBody(true)
2124 }
2125
2126 getRowByUniqueId (_id) {
2127 const uniqueId = this.options.uniqueId
2128 const len = this.options.data.length
2129 let id = _id
2130 let dataRow = null
2131 let i
2132 let row
2133 let rowUniqueId
2134
2135 for (i = len - 1; i >= 0; i--) {
2136 row = this.options.data[i]
2137
2138 if (row.hasOwnProperty(uniqueId)) { // uniqueId is a column
2139 rowUniqueId = row[uniqueId]
2140 } else if (row._data && row._data.hasOwnProperty(uniqueId)) { // uniqueId is a row data property
2141 rowUniqueId = row._data[uniqueId]
2142 } else {
2143 continue
2144 }
2145
2146 if (typeof rowUniqueId === 'string') {
2147 id = id.toString()
2148 } else if (typeof rowUniqueId === 'number') {
2149 if ((Number(rowUniqueId) === rowUniqueId) && (rowUniqueId % 1 === 0)) {
2150 id = parseInt(id)
2151 } else if ((rowUniqueId === Number(rowUniqueId)) && (rowUniqueId !== 0)) {
2152 id = parseFloat(id)
2153 }
2154 }
2155
2156 if (rowUniqueId === id) {
2157 dataRow = row
2158 break
2159 }
2160 }
2161
2162 return dataRow
2163 }
2164
2165 updateByUniqueId (params) {
2166 const allParams = Array.isArray(params) ? params : [params]
2167
2168 for (const params of allParams) {
2169 if (!params.hasOwnProperty('id') || !params.hasOwnProperty('row')) {
2170 continue
2171 }
2172
2173 const rowId = this.options.data.indexOf(this.getRowByUniqueId(params.id))
2174 if (rowId === -1) {
2175 continue
2176 }
2177
2178 if (params.hasOwnProperty('replace') && params.replace) {
2179 this.options.data[rowId] = params.row
2180 } else {
2181 $.extend(this.options.data[rowId], params.row)
2182 }
2183 }
2184
2185 this.initSearch()
2186 this.initPagination()
2187 this.initSort()
2188 this.initBody(true)
2189 }
2190
2191 removeByUniqueId (id) {
2192 const len = this.options.data.length
2193 const row = this.getRowByUniqueId(id)
2194
2195 if (row) {
2196 this.options.data.splice(this.options.data.indexOf(row), 1)
2197 }
2198
2199 if (len === this.options.data.length) {
2200 return
2201 }
2202
2203 this.initSearch()
2204 this.initPagination()
2205 this.initBody(true)
2206 }
2207
2208 updateCell (params) {
2209 if (!params.hasOwnProperty('index') ||
2210 !params.hasOwnProperty('field') ||
2211 !params.hasOwnProperty('value')) {
2212 return
2213 }
2214 this.data[params.index][params.field] = params.value
2215
2216 if (params.reinit === false) {
2217 return
2218 }
2219 this.initSort()
2220 this.initBody(true)
2221 }
2222
2223 updateCellByUniqueId (params) {
2224 if (!params.hasOwnProperty('id') ||
2225 !params.hasOwnProperty('field') ||
2226 !params.hasOwnProperty('value')) {
2227 return
2228 }
2229 const allParams = Array.isArray(params) ? params : [params]
2230
2231 allParams.forEach(({id, field, value}) => {
2232 const rowId = this.options.data.indexOf(this.getRowByUniqueId(id))
2233
2234 if (rowId === -1) {
2235 return
2236 }
2237 this.options.data[rowId][field] = value
2238 })
2239
2240 if (params.reinit === false) {
2241 return
2242 }
2243 this.initSort()
2244 this.initBody(true)
2245 }
2246
2247 showRow (params) {
2248 this._toggleRow(params, true)
2249 }
2250
2251 hideRow (params) {
2252 this._toggleRow(params, false)
2253 }
2254
2255 _toggleRow (params, visible) {
2256 let row
2257
2258 if (params.hasOwnProperty('index')) {
2259 row = this.getData()[params.index]
2260 } else if (params.hasOwnProperty('uniqueId')) {
2261 row = this.getRowByUniqueId(params.uniqueId)
2262 }
2263
2264 if (!row) {
2265 return
2266 }
2267
2268 const index = Utils.findIndex(this.hiddenRows, row)
2269
2270 if (!visible && index === -1) {
2271 this.hiddenRows.push(row)
2272 } else if (visible && index > -1) {
2273 this.hiddenRows.splice(index, 1)
2274 }
2275 if (visible) {
2276 this.updatePagination()
2277 } else {
2278 this.initBody(true)
2279 this.initPagination()
2280 }
2281 }
2282
2283 getHiddenRows (show) {
2284 if (show) {
2285 this.initHiddenRows()
2286 this.initBody(true)
2287 return
2288 }
2289 const data = this.getData()
2290 const rows = []
2291
2292 for (const row of data) {
2293 if (this.hiddenRows.includes(row)) {
2294 rows.push(row)
2295 }
2296 }
2297 this.hiddenRows = rows
2298 return rows
2299 }
2300
2301 showColumn (field) {
2302 const fields = Array.isArray(field) ? field : [field]
2303 fields.forEach(field => {
2304 this._toggleColumn(this.fieldsColumnsIndex[field], true, true)
2305 })
2306 }
2307
2308 hideColumn (field) {
2309 const fields = Array.isArray(field) ? field : [field]
2310 fields.forEach(field => {
2311 this._toggleColumn(this.fieldsColumnsIndex[field], false, true)
2312 })
2313 }
2314
2315 _toggleColumn (index, checked, needUpdate) {
2316 if (index === -1 || this.columns[index].visible === checked) {
2317 return
2318 }
2319 this.columns[index].visible = checked
2320 this.initHeader()
2321 this.initSearch()
2322 this.initPagination()
2323 this.initBody()
2324
2325 if (this.options.showColumns) {
2326 const $items = this.$toolbar.find('.keep-open input').prop('disabled', false)
2327
2328 if (needUpdate) {
2329 $items.filter(Utils.sprintf('[value="%s"]', index)).prop('checked', checked)
2330 }
2331
2332 if ($items.filter(':checked').length <= this.options.minimumCountColumns) {
2333 $items.filter(':checked').prop('disabled', true)
2334 }
2335 }
2336 }
2337
2338 getVisibleColumns () {
2339 return this.columns.filter(({visible}) => visible)
2340 }
2341
2342 getHiddenColumns () {
2343 return this.columns.filter(({visible}) => !visible)
2344 }
2345
2346 showAllColumns () {
2347 this._toggleAllColumns(true)
2348 }
2349
2350 hideAllColumns () {
2351 this._toggleAllColumns(false)
2352 }
2353
2354 _toggleAllColumns (visible) {
2355 for (const column of this.columns.slice().reverse()) {
2356 if (column.switchable) {
2357 if (!visible && this.options.showColumns && this.getVisibleColumns().length === this.options.minimumCountColumns) {
2358 continue
2359 }
2360 column.visible = visible
2361 }
2362 }
2363
2364 this.initHeader()
2365 this.initSearch()
2366 this.initPagination()
2367 this.initBody()
2368 if (this.options.showColumns) {
2369 const $items = this.$toolbar.find('.keep-open input:not(".toggle-all")').prop('disabled', false)
2370
2371 if (visible) {
2372 $items.prop('checked', visible)
2373 } else {
2374 $items.get().reverse().forEach((item) => {
2375 if ($items.filter(':checked').length > this.options.minimumCountColumns) {
2376 $(item).prop('checked', visible)
2377 }
2378 })
2379 }
2380
2381 if ($items.filter(':checked').length <= this.options.minimumCountColumns) {
2382 $items.filter(':checked').prop('disabled', true)
2383 }
2384 }
2385 }
2386
2387 mergeCells (options) {
2388 const row = options.index
2389 let col = this.getVisibleFields().indexOf(options.field)
2390 const rowspan = options.rowspan || 1
2391 const colspan = options.colspan || 1
2392 let i
2393 let j
2394 const $tr = this.$body.find('>tr')
2395
2396 if (this.options.detailView && !this.options.cardView) {
2397 col += 1
2398 }
2399
2400 const $td = $tr.eq(row).find('>td').eq(col)
2401
2402 if (row < 0 || col < 0 || row >= this.data.length) {
2403 return
2404 }
2405
2406 for (i = row; i < row + rowspan; i++) {
2407 for (j = col; j < col + colspan; j++) {
2408 $tr.eq(i).find('>td').eq(j).hide()
2409 }
2410 }
2411
2412 $td.attr('rowspan', rowspan).attr('colspan', colspan).show()
2413 }
2414
2415 checkAll () {
2416 this._toggleCheckAll(true)
2417 }
2418
2419 uncheckAll () {
2420 this._toggleCheckAll(false)
2421 }
2422
2423 _toggleCheckAll (checked) {
2424 const rowsBefore = this.getSelections()
2425 this.$selectAll.add(this.$selectAll_).prop('checked', checked)
2426 this.$selectItem.filter(':enabled').prop('checked', checked)
2427 this.updateRows()
2428
2429 const rowsAfter = this.getSelections()
2430 if (checked) {
2431 this.trigger('check-all', rowsAfter, rowsBefore)
2432 return
2433 }
2434
2435 this.trigger('uncheck-all', rowsAfter, rowsBefore)
2436 }
2437
2438 checkInvert () {
2439 const $items = this.$selectItem.filter(':enabled')
2440 let checked = $items.filter(':checked')
2441 $items.each((i, el) => {
2442 $(el).prop('checked', !$(el).prop('checked'))
2443 })
2444 this.updateRows()
2445 this.updateSelected()
2446 this.trigger('uncheck-some', checked)
2447 checked = this.getSelections()
2448 this.trigger('check-some', checked)
2449 }
2450
2451 check (index) {
2452 this._toggleCheck(true, index)
2453 }
2454
2455 uncheck (index) {
2456 this._toggleCheck(false, index)
2457 }
2458
2459 _toggleCheck (checked, index) {
2460 const $el = this.$selectItem.filter(`[data-index="${index}"]`)
2461 const row = this.data[index]
2462
2463 if (
2464 $el.is(':radio') ||
2465 this.options.singleSelect ||
2466 this.options.multipleSelectRow &&
2467 !this.multipleSelectRowCtrlKey &&
2468 !this.multipleSelectRowShiftKey
2469 ) {
2470 for (const r of this.options.data) {
2471 r[this.header.stateField] = false
2472 }
2473 this.$selectItem.filter(':checked').not($el).prop('checked', false)
2474 }
2475
2476 row[this.header.stateField] = checked
2477
2478 if (this.options.multipleSelectRow) {
2479 if (this.multipleSelectRowShiftKey && this.multipleSelectRowLastSelectedIndex >= 0) {
2480 const indexes = [this.multipleSelectRowLastSelectedIndex, index].sort()
2481
2482 for (let i = indexes[0] + 1; i < indexes[1]; i++) {
2483 this.data[i][this.header.stateField] = true
2484 this.$selectItem.filter(`[data-index="${i}"]`).prop('checked', true)
2485 }
2486 }
2487
2488 this.multipleSelectRowCtrlKey = false
2489 this.multipleSelectRowShiftKey = false
2490 this.multipleSelectRowLastSelectedIndex = checked ? index : -1
2491 }
2492
2493 $el.prop('checked', checked)
2494 this.updateSelected()
2495 this.trigger(checked ? 'check' : 'uncheck', this.data[index], $el)
2496 }
2497
2498 checkBy (obj) {
2499 this._toggleCheckBy(true, obj)
2500 }
2501
2502 uncheckBy (obj) {
2503 this._toggleCheckBy(false, obj)
2504 }
2505
2506 _toggleCheckBy (checked, obj) {
2507 if (!obj.hasOwnProperty('field') || !obj.hasOwnProperty('values')) {
2508 return
2509 }
2510
2511 const rows = []
2512 this.data.forEach((row, i) => {
2513 if (!row.hasOwnProperty(obj.field)) {
2514 return false
2515 }
2516 if (obj.values.includes(row[obj.field])) {
2517 let $el = this.$selectItem.filter(':enabled')
2518 .filter(Utils.sprintf('[data-index="%s"]', i))
2519
2520 $el = checked ? $el.not(':checked') : $el.filter(':checked')
2521
2522 if (!$el.length) {
2523 return
2524 }
2525
2526 $el.prop('checked', checked)
2527 row[this.header.stateField] = checked
2528 rows.push(row)
2529 this.trigger(checked ? 'check' : 'uncheck', row, $el)
2530 }
2531 })
2532 this.updateSelected()
2533 this.trigger(checked ? 'check-some' : 'uncheck-some', rows)
2534 }
2535
2536 refresh (params) {
2537 if (params && params.url) {
2538 this.options.url = params.url
2539 }
2540 if (params && params.pageNumber) {
2541 this.options.pageNumber = params.pageNumber
2542 }
2543 if (params && params.pageSize) {
2544 this.options.pageSize = params.pageSize
2545 }
2546 this.trigger('refresh', this.initServer(params && params.silent,
2547 params && params.query, params && params.url))
2548 }
2549
2550 destroy () {
2551 this.$el.insertBefore(this.$container)
2552 $(this.options.toolbar).insertBefore(this.$el)
2553 this.$container.next().remove()
2554 this.$container.remove()
2555 this.$el.html(this.$el_.html())
2556 .css('margin-top', '0')
2557 .attr('class', this.$el_.attr('class') || '') // reset the class
2558 }
2559
2560 resetView (params) {
2561 let padding = 0
2562
2563 if (params && params.height) {
2564 this.options.height = params.height
2565 }
2566
2567 this.$selectAll.prop('checked', this.$selectItem.length > 0 &&
2568 this.$selectItem.length === this.$selectItem.filter(':checked').length)
2569
2570 this.$tableContainer.toggleClass('has-card-view', this.options.cardView)
2571
2572 if (!this.options.cardView && this.options.showHeader && this.options.height) {
2573 this.$tableHeader.show()
2574 this.resetHeader()
2575 padding += this.$header.outerHeight(true) + 1
2576 } else {
2577 this.$tableHeader.hide()
2578 this.trigger('post-header')
2579 }
2580
2581 if (!this.options.cardView && this.options.showFooter) {
2582 this.$tableFooter.show()
2583 this.fitFooter()
2584 if (this.options.height) {
2585 padding += this.$tableFooter.outerHeight(true)
2586 }
2587 }
2588
2589 if (this.options.height) {
2590 const toolbarHeight = this.$toolbar.outerHeight(true)
2591 const paginationHeight = this.$pagination.outerHeight(true)
2592 const height = this.options.height - toolbarHeight - paginationHeight
2593 const tableHeight = this.$tableBody.find('table').outerHeight(true)
2594 this.$tableContainer.css('height', `${height}px`)
2595 this.$tableBorder && this.$tableBorder.css('height', `${height - tableHeight - padding - 1}px`)
2596 }
2597
2598 if (this.options.cardView) {
2599 // remove the element css
2600 this.$el.css('margin-top', '0')
2601 this.$tableContainer.css('padding-bottom', '0')
2602 this.$tableFooter.hide()
2603 } else {
2604 // Assign the correct sortable arrow
2605 this.getCaret()
2606 this.$tableContainer.css('padding-bottom', `${padding}px`)
2607 }
2608
2609 this.trigger('reset-view')
2610 }
2611
2612 resetWidth () {
2613 if (this.options.showHeader && this.options.height) {
2614 this.fitHeader()
2615 }
2616 if (this.options.showFooter && !this.options.cardView) {
2617 this.fitFooter()
2618 }
2619 }
2620
2621 showLoading () {
2622 this.$tableLoading.css('display', 'flex')
2623 }
2624
2625 hideLoading () {
2626 this.$tableLoading.css('display', 'none')
2627 }
2628
2629 togglePagination () {
2630 this.options.pagination = !this.options.pagination
2631
2632 const icon = this.options.showButtonIcons ? this.options.pagination ? this.options.icons.paginationSwitchDown : this.options.icons.paginationSwitchUp : ''
2633 const text = this.options.showButtonText ? this.options.pagination ? this.options.formatPaginationSwitchUp() : this.options.formatPaginationSwitchDown() : ''
2634 this.$toolbar.find('button[name="paginationSwitch"]')
2635 .html(Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, icon) + ' ' + text)
2636 this.updatePagination()
2637 }
2638
2639 toggleFullscreen () {
2640 this.$el.closest('.bootstrap-table').toggleClass('fullscreen')
2641 this.resetView()
2642 }
2643
2644 toggleView () {
2645 this.options.cardView = !this.options.cardView
2646 this.initHeader()
2647
2648 const icon = this.options.showButtonIcons ? this.options.cardView ? this.options.icons.toggleOn : this.options.icons.toggleOff : ''
2649 const text = this.options.showButtonText ? this.options.cardView ? this.options.formatToggleOff() : this.options.formatToggleOn() : ''
2650 this.$toolbar.find('button[name="toggle"]')
2651 .html(Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, icon) + ' ' + text)
2652 this.initBody()
2653 this.trigger('toggle', this.options.cardView)
2654 }
2655
2656 resetSearch (text) {
2657 const $search = this.$toolbar.find('.search input')
2658 $search.val(text || '')
2659 this.onSearch({currentTarget: $search})
2660 }
2661
2662 filterBy (columns, options) {
2663 this.filterOptions = Utils.isEmptyObject(options) ? this.options.filterOptions : $.extend(this.options.filterOptions, options)
2664 this.filterColumns = Utils.isEmptyObject(columns) ? {} : columns
2665 this.options.pageNumber = 1
2666 this.initSearch()
2667 this.updatePagination()
2668 }
2669
2670 scrollTo (params) {
2671 if (typeof params === 'undefined') {
2672 return this.$tableBody.scrollTop()
2673 }
2674
2675 let options = {unit: 'px', value: 0}
2676 if (typeof params === 'object') {
2677 options = Object.assign(options, params)
2678 } else if (typeof params === 'string' && params === 'bottom') {
2679 options.value = this.$tableBody[0].scrollHeight
2680 } else if (typeof params === 'string') {
2681 options.value = params
2682 }
2683
2684 let scrollTo = options.value
2685 if (options.unit === 'rows') {
2686 scrollTo = 0
2687 this.$body.find(`> tr:lt(${options.value})`).each((i, el) => {
2688 scrollTo += $(el).outerHeight(true)
2689 })
2690 }
2691
2692 this.$tableBody.scrollTop(scrollTo)
2693 }
2694
2695 getScrollPosition () {
2696 return this.scrollTo()
2697 }
2698
2699 selectPage (page) {
2700 if (page > 0 && page <= this.options.totalPages) {
2701 this.options.pageNumber = page
2702 this.updatePagination()
2703 }
2704 }
2705
2706 prevPage () {
2707 if (this.options.pageNumber > 1) {
2708 this.options.pageNumber--
2709 this.updatePagination()
2710 }
2711 }
2712
2713 nextPage () {
2714 if (this.options.pageNumber < this.options.totalPages) {
2715 this.options.pageNumber++
2716 this.updatePagination()
2717 }
2718 }
2719
2720 toggleDetailView (index, _columnDetailFormatter) {
2721 const $tr = this.$body.find(Utils.sprintf('> tr[data-index="%s"]', index))
2722
2723 if ($tr.next().is('tr.detail-view')) {
2724 this.collapseRow(index)
2725 } else {
2726 this.expandRow(index, _columnDetailFormatter)
2727 }
2728
2729 this.resetView()
2730 }
2731
2732 expandRow (index, _columnDetailFormatter) {
2733 const row = this.data[index]
2734 const $tr = this.$body.find(Utils.sprintf('> tr[data-index="%s"][data-has-detail-view]', index))
2735 if ($tr.next().is('tr.detail-view')) {
2736 return
2737 }
2738
2739 if (this.options.detailViewIcon) {
2740 $tr.find('a.detail-icon').html(Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, this.options.icons.detailClose))
2741 }
2742
2743 $tr.after(Utils.sprintf('<tr class="detail-view"><td colspan="%s"></td></tr>', $tr.children('td').length))
2744
2745 const $element = $tr.next().find('td')
2746
2747 const detailFormatter = _columnDetailFormatter || this.options.detailFormatter
2748 const content = Utils.calculateObjectValue(this.options, detailFormatter, [index, row, $element], '')
2749 if ($element.length === 1) {
2750 $element.append(content)
2751 }
2752
2753 this.trigger('expand-row', index, row, $element)
2754 }
2755
2756 collapseRow (index) {
2757 const row = this.data[index]
2758 const $tr = this.$body.find(Utils.sprintf('> tr[data-index="%s"][data-has-detail-view]', index))
2759 if (!$tr.next().is('tr.detail-view')) {
2760 return
2761 }
2762
2763 if (this.options.detailViewIcon) {
2764 $tr.find('a.detail-icon').html(Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, this.options.icons.detailOpen))
2765 }
2766
2767 this.trigger('collapse-row', index, row, $tr.next())
2768 $tr.next().remove()
2769 }
2770
2771 expandAllRows () {
2772 const trs = this.$body.find('> tr[data-index][data-has-detail-view]')
2773 for (let i = 0; i < trs.length; i++) {
2774 this.expandRow($(trs[i]).data('index'))
2775 }
2776 }
2777
2778 collapseAllRows () {
2779 const trs = this.$body.find('> tr[data-index][data-has-detail-view]')
2780 for (let i = 0; i < trs.length; i++) {
2781 this.collapseRow($(trs[i]).data('index'))
2782 }
2783 }
2784
2785 updateColumnTitle (params) {
2786 if (!params.hasOwnProperty('field') || !params.hasOwnProperty('title')) {
2787 return
2788 }
2789
2790 this.columns[this.fieldsColumnsIndex[params.field]].title =
2791 this.options.escape ? Utils.escapeHTML(params.title) : params.title
2792
2793 if (this.columns[this.fieldsColumnsIndex[params.field]].visible) {
2794 const header = this.options.height !== undefined ? this.$tableHeader : this.$header
2795 header.find('th[data-field]').each((i, el) => {
2796 if ($(el).data('field') === params.field) {
2797 $($(el).find('.th-inner')[0]).text(params.title)
2798 return false
2799 }
2800 })
2801 }
2802 }
2803
2804 updateFormatText (formatName, text) {
2805 if (!/^format/.test(formatName) || !this.options[formatName]) {
2806 return
2807 }
2808 if (typeof text === 'string') {
2809 this.options[formatName] = () => text
2810 } else if (typeof text === 'function') {
2811 this.options[formatName] = text
2812 }
2813 this.initToolbar()
2814 this.initPagination()
2815 this.initBody()
2816 }
2817}
2818
2819BootstrapTable.VERSION = Constants.VERSION
2820BootstrapTable.DEFAULTS = Constants.DEFAULTS
2821BootstrapTable.LOCALES = Constants.LOCALES
2822BootstrapTable.COLUMN_DEFAULTS = Constants.COLUMN_DEFAULTS
2823BootstrapTable.METHODS = Constants.METHODS
2824BootstrapTable.EVENTS = Constants.EVENTS
2825
2826// BOOTSTRAP TABLE PLUGIN DEFINITION
2827// =======================
2828
2829$.BootstrapTable = BootstrapTable
2830$.fn.bootstrapTable = function (option, ...args) {
2831 let value
2832
2833 this.each((i, el) => {
2834 let data = $(el).data('bootstrap.table')
2835 const options = $.extend({}, BootstrapTable.DEFAULTS, $(el).data(),
2836 typeof option === 'object' && option)
2837
2838 if (typeof option === 'string') {
2839 if (!Constants.METHODS.includes(option)) {
2840 throw new Error(`Unknown method: ${option}`)
2841 }
2842
2843 if (!data) {
2844 return
2845 }
2846
2847 value = data[option](...args)
2848
2849 if (option === 'destroy') {
2850 $(el).removeData('bootstrap.table')
2851 }
2852 }
2853
2854 if (!data) {
2855 $(el).data('bootstrap.table', (data = new $.BootstrapTable(el, options)))
2856 }
2857 })
2858
2859 return typeof value === 'undefined' ? this : value
2860}
2861
2862$.fn.bootstrapTable.Constructor = BootstrapTable
2863$.fn.bootstrapTable.theme = Constants.THEME
2864$.fn.bootstrapTable.VERSION = Constants.VERSION
2865$.fn.bootstrapTable.defaults = BootstrapTable.DEFAULTS
2866$.fn.bootstrapTable.columnDefaults = BootstrapTable.COLUMN_DEFAULTS
2867$.fn.bootstrapTable.events = BootstrapTable.EVENTS
2868$.fn.bootstrapTable.locales = BootstrapTable.LOCALES
2869$.fn.bootstrapTable.methods = BootstrapTable.METHODS
2870$.fn.bootstrapTable.utils = Utils
2871
2872// BOOTSTRAP TABLE INIT
2873// =======================
2874
2875$(() => {
2876 $('[data-toggle="table"]').bootstrapTable()
2877})
2878
2879export default BootstrapTable