Merge branch 'develop' into fix/5991

.travis.yml

@@ -7,7 +7,7 @@ jobs:
     - stage: test
       language: node_js
       node_js:
-        - 12
+        - 14
       name: "Lint src and check docs"
       cache:
         npm: true
@@ -22,7 +22,7 @@ jobs:
     - stage: test
       language: node_js
       node_js:
-        - 12
+        - 14
       name: "Cypress Test"
       cache:
         npm: true
@@ -40,7 +40,7 @@ jobs:
       rvm:
         - 2.4.1
       before_install:
-        - nvm install 12
+        - nvm install 14
       script: ./deploy.sh
       if: branch = master AND type = push
       cache: bundler

site/docs/api/column-options.md

@@ -156,7 +156,7 @@ The column options is defined in `jQuery.fn.bootstrapTable.columnDefaults`.
 
   Escapes a string for insertion into HTML, replacing &, <, >, ", \`, and ' characters.
 
-- **Default:** `false`
+- **Default:** `undefined`
 
 - **Example:** [Column Escape](https://examples.bootstrap-table.com/#column-options/escape.html)
 

src/bootstrap-table.js

@@ -1512,8 +1512,9 @@ class BootstrapTable {
     }
 
     this.header.fields.forEach((field, j) => {
+      const column = this.columns[j]
       let text = ''
-      let value_ = Utils.getItemField(item, field, this.options.escape)
+      let value_ = Utils.getItemField(item, field, this.options.escape, column.escape)
       let value = ''
       let type = ''
       let cellStyle = {}
@@ -1525,7 +1526,6 @@ class BootstrapTable {
       let rowspan_ = ''
       let colspan_ = ''
       let title_ = ''
-      const column = this.columns[j]
 
       if ((this.fromHtml || this.autoMergeCells) && typeof value_ === 'undefined') {
         if ((!column.checkbox) && (!column.radio)) {
@@ -1794,7 +1794,7 @@ class BootstrapTable {
       const fields = this.getVisibleFields()
       const field = fields[index - Utils.getDetailViewIndexOffset(this.options)]
       const column = this.columns[this.fieldsColumnsIndex[field]]
-      const value = Utils.getItemField(item, field, this.options.escape)
+      const value = Utils.getItemField(item, field, this.options.escape, column.escape)
 
       if ($td.find('.detail-icon').length) {
         return

src/constants/index.js

@@ -445,7 +445,7 @@ const COLUMN_DEFAULTS = {
   detailFormatter: undefined,
   searchFormatter: true,
   searchHighlightFormatter: false,
-  escape: false,
+  escape: undefined,
   events: undefined
 }
 

src/extensions/fixed-columns/bootstrap-table-fixed-columns.js

@@ -144,7 +144,7 @@ $.BootstrapTable = class extends $.BootstrapTable {
       const inputSelector = `[name="${this.options.selectItemName}"]`
       const $input = $el.find(inputSelector)
 
-      if (typeof index === undefined) {
+      if (typeof index === 'undefined') {
         return
       }
 

src/extensions/toolbar/bootstrap-table-toolbar.js

@@ -13,16 +13,17 @@ const theme = {
     icons: {
       advancedSearchIcon: 'glyphicon-chevron-down'
     },
+    classes: {},
     html: {
       modal: `
         <div id="avdSearchModal_%s"  class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
           <div class="modal-dialog modal-xs">
             <div class="modal-content">
               <div class="modal-header">
-                <h4 class="modal-title">%s</h4>
                 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                   <span aria-hidden="true">&times;</span>
                 </button>
+                <h4 class="modal-title">%s</h4>
               </div>
               <div class="modal-body modal-body-custom">
                 <div class="container-fluid" id="avdSearchModalContent_%s"
@@ -42,6 +43,7 @@ const theme = {
     icons: {
       advancedSearchIcon: 'fa-chevron-down'
     },
+    classes: {},
     html: {
       modal: `
         <div id="avdSearchModal_%s"  class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
@@ -71,16 +73,17 @@ const theme = {
     icons: {
       advancedSearchIcon: 'bi-chevron-down'
     },
+    classes: {
+      formGroup: 'mb-3'
+    },
     html: {
       modal: `
-        <div id="avdSearchModal_%s"  class="modal fade" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true">
+        <div id="avdSearchModal_%s" class="modal fade" tabindex="-1" aria-labelledby="mySmallModalLabel" aria-hidden="true">
           <div class="modal-dialog modal-xs">
             <div class="modal-content">
               <div class="modal-header">
-                <h4 class="modal-title">%s</h4>
-                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
-                  <span aria-hidden="true">&times;</span>
-                </button>
+                <h5 class="modal-title">%s</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
               </div>
               <div class="modal-body modal-body-custom">
                 <div class="container-fluid" id="avdSearchModalContent_%s"
@@ -100,6 +103,7 @@ const theme = {
     icons: {
       advancedSearchIcon: 'fa-chevron-down'
     },
+    classes: {},
     html: {
       modal: `
         <div class="modal" id="avdSearchModal_%s">
@@ -122,6 +126,7 @@ const theme = {
     icons: {
       advancedSearchIcon: 'fa-chevron-down'
     },
+    classes: {},
     html: {
       modal: `
         <div class="reveal" id="avdSearchModal_%s" data-reveal>
@@ -142,6 +147,7 @@ const theme = {
     icons: {
       advancedSearchIcon: 'expand_more'
     },
+    classes: {},
     html: {
       modal: `
         <div id="avdSearchModal_%s" class="modal">
@@ -162,6 +168,7 @@ const theme = {
     icons: {
       advancedSearchIcon: 'fa-chevron-down'
     },
+    classes: {},
     html: {
       modal: `
         <div class="ui modal" id="avdSearchModal_%s">
@@ -331,7 +338,7 @@ $.BootstrapTable = class extends $.BootstrapTable {
     for (const column of this.columns) {
       if (!column.checkbox && column.visible && column.searchable) {
         html.push(`
-          <div class="form-group row">
+          <div class="form-group row ${theme.classes.formGroup || ''}">
             <label class="col-sm-4 control-label">${column.title}</label>
             <div class="col-sm-6">
               <input type="text" class="form-control ${this.constants.classes.input}" name="${column.field}" placeholder="${column.title}" id="${column.field}">

src/utils/index.js

@@ -364,9 +364,14 @@ export default {
     return dataAttr
   },
 
-  getItemField (item, field, escape) {
+  getItemField (item, field, escape, columnEscape = undefined) {
     let value = item
 
+    // use column escape if it is defined
+    if (typeof columnEscape !== 'undefined') {
+      escape = columnEscape
+    }
+
     if (typeof field !== 'string' || item.hasOwnProperty(field)) {
       return escape ? this.escapeHTML(item[field]) : item[field]
     }