Merge pull request #5283 from wenzhixin/feature/fix-5270

Supporting style

src/bootstrap-table.js

@@ -139,6 +139,7 @@ class BootstrapTable {
     }
 
     this._headerTrClasses = []
+    this._headerTrStyles = []
     this.$header.find('tr').each((i, el) => {
       const $tr = $(el)
       const column = []
@@ -163,6 +164,9 @@ class BootstrapTable {
       if ($tr.attr('class')) {
         this._headerTrClasses.push($tr.attr('class'))
       }
+      if ($tr.attr('style')) {
+        this._headerTrStyles.push($tr.attr('style'))
+      }
     })
 
     if (!Array.isArray(this.options.columns[0])) {
@@ -232,7 +236,7 @@ class BootstrapTable {
     Utils.updateFieldGroup(this.options.columns)
 
     this.options.columns.forEach((columns, i) => {
-      html.push(`<tr${Utils.sprintf(' class="%s"', this._headerTrClasses[i])}>`)
+      html.push(`<tr${Utils.sprintf(' class="%s"', this._headerTrClasses[i])} ${Utils.sprintf(' style="%s"', this._headerTrStyles[i])}>`)
 
       let detailViewTemplate = ''
 
@@ -1336,6 +1340,7 @@ class BootstrapTable {
       Utils.sprintf(' %s', htmlAttributes.length ? htmlAttributes.join(' ') : undefined),
       Utils.sprintf(' id="%s"', Array.isArray(item) ? undefined : item._id),
       Utils.sprintf(' class="%s"', style.classes || (Array.isArray(item) ? undefined : item._class)),
+      Utils.sprintf(' style="%s"', Array.isArray(item) ? undefined : item._style),
       ` data-index="${i}"`,
       Utils.sprintf(' data-uniqueid="%s"', Utils.getItemField(item, this.options.uniqueId, false)),
       Utils.sprintf(' data-has-detail-view="%s"', (this.options.detailView && Utils.calculateObjectValue(null, this.options.detailFilter, [i, item])) ? 'true' : undefined),
@@ -1376,6 +1381,7 @@ class BootstrapTable {
       let id_ = ''
       let class_ = this.header.classes[j]
       let style_ = ''
+      let styleToAdd_ = ''
       let data_ = ''
       let rowspan_ = ''
       let colspan_ = ''
@@ -1400,9 +1406,19 @@ class BootstrapTable {
         value_ = Utils.escapeHTML(value_)
       }
 
+      // Style concat
       if (csses.concat([this.header.styles[j]]).length) {
-        style_ = ` style="${csses.concat([this.header.styles[j]]).join('; ')}"`
+        styleToAdd_ += `${csses.concat([this.header.styles[j]]).join('; ')}`
+      }
+      if (item[`_${field}_style`]) {
+        styleToAdd_ += `${item[`_${field}_style`]}`
       }
+
+      if (styleToAdd_) {
+        style_ = ` style="${styleToAdd_}"`
+      }
+      // Style concat
+
       // handle id and class of td
       if (item[`_${field}_id`]) {
         id_ = Utils.sprintf(' id="%s"', item[`_${field}_id`])

src/utils/index.js

@@ -247,16 +247,19 @@ export default {
     const m = []
 
     $els.each((y, el) => {
+      const $el = $(el)
       const row = {}
 
       // save tr's id, class and data-* attributes
-      row._id = $(el).attr('id')
-      row._class = $(el).attr('class')
-      row._data = this.getRealDataAttr($(el).data())
-
-      $(el).find('>td,>th').each((_x, el) => {
-        const cspan = +$(el).attr('colspan') || 1
-        const rspan = +$(el).attr('rowspan') || 1
+      row._id = $el.attr('id')
+      row._class = $el.attr('class')
+      row._data = this.getRealDataAttr($el.data())
+      row._style = $el.attr('style')
+
+      $el.find('>td,>th').each((_x, el) => {
+        const $el = $(el)
+        const cspan = +$el.attr('colspan') || 1
+        const rspan = +$el.attr('rowspan') || 1
         let x = _x
 
         // skip already occupied cells in current row
@@ -276,14 +279,15 @@ export default {
 
         const field = columns[x].field
 
-        row[field] = $(el).html().trim()
+        row[field] = $el.html().trim()
         // save td's id, class and data-* attributes
-        row[`_${field}_id`] = $(el).attr('id')
-        row[`_${field}_class`] = $(el).attr('class')
-        row[`_${field}_rowspan`] = $(el).attr('rowspan')
-        row[`_${field}_colspan`] = $(el).attr('colspan')
-        row[`_${field}_title`] = $(el).attr('title')
-        row[`_${field}_data`] = this.getRealDataAttr($(el).data())
+        row[`_${field}_id`] = $el.attr('id')
+        row[`_${field}_class`] = $el.attr('class')
+        row[`_${field}_rowspan`] = $el.attr('rowspan')
+        row[`_${field}_colspan`] = $el.attr('colspan')
+        row[`_${field}_title`] = $el.attr('title')
+        row[`_${field}_data`] = this.getRealDataAttr($el.data())
+        row[`_${field}_style`] = $el.attr('style')
       })
       data.push(row)
     })