浏览代码

feat(js): add footer styling

feat(js): add 'footerStyle' option
wenzhixin 9 年之前
父节点
当前提交
aa10550fa2
共有 2 个文件被更改,包括 44 次插入10 次删除
  1. 19 0
      docs/_i18n/en/documentation/table-options.md
  2. 25 10
      src/bootstrap-table.js

+ 19 - 0
docs/_i18n/en/documentation/table-options.md

@@ -619,5 +619,24 @@ function rowStyle(value, row, index) {
         if no locale files loaded).
         if no locale files loaded).
         </td>
         </td>
     </tr>
     </tr>
+    <tr>
+	<td>footerStyle</td>
+	<td>data-footer-style</td>
+	<td>Function</td>
+	<td>{}</td>
+	<td>
+	        The footer style formatter function, takes two parameters: <br>
+	        row: the row record data.<br>
+	        index: the row index.<br>
+	        Support classes or css. Example usage:<br>
+		<pre>
+		function footerStyle(value, row, index) {
+		  return {
+		    css: { "font-weight": "bold" }
+		  };
+		}
+		</pre>
+	</td>
+    </tr>
    </tbody>
    </tbody>
 </table>
 </table>

+ 25 - 10
src/bootstrap-table.js

@@ -380,6 +380,10 @@
         rowAttributes: function (row, index) {
         rowAttributes: function (row, index) {
             return {};
             return {};
         },
         },
+    
+        footerStyle: function (row, index) {
+            return {};
+        },
 
 
         onAll: function (name, args) {
         onAll: function (name, args) {
             return false;
             return false;
@@ -2145,26 +2149,37 @@
         }
         }
 
 
         $.each(this.columns, function (i, column) {
         $.each(this.columns, function (i, column) {
-            var falign = '', // footer align style
-                style = '',
+            var key,
+                falign = '', // footer align style
+                valign = '',
+                csses = [],
+                style = {},
                 class_ = sprintf(' class="%s"', column['class']);
                 class_ = sprintf(' class="%s"', column['class']);
-
+ 
             if (!column.visible) {
             if (!column.visible) {
                 return;
                 return;
             }
             }
-
+ 
             if (that.options.cardView && (!column.cardVisible)) {
             if (that.options.cardView && (!column.cardVisible)) {
                 return;
                 return;
             }
             }
-
+ 
             falign = sprintf('text-align: %s; ', column.falign ? column.falign : column.align);
             falign = sprintf('text-align: %s; ', column.falign ? column.falign : column.align);
-            style = sprintf('vertical-align: %s; ', column.valign);
-
-            html.push('<td', class_, sprintf(' style="%s"', falign + style), '>');
+            valign = sprintf('vertical-align: %s; ', column.valign);
+ 
+            style = calculateObjectValue(null, that.options.footerStyle);
+ 
+            if (style && style.css) {
+                for (key in style.css) {
+                    csses.push(key + ': ' + style.css[key]);
+                }
+            }
+ 
+            html.push('<td', class_, sprintf(' style="%s"', falign + valign + csses.concat().join('; ')), '>');
             html.push('<div class="th-inner">');
             html.push('<div class="th-inner">');
-
+ 
             html.push(calculateObjectValue(column, column.footerFormatter, [data], '&nbsp;') || '&nbsp;');
             html.push(calculateObjectValue(column, column.footerFormatter, [data], '&nbsp;') || '&nbsp;');
-
+ 
             html.push('</div>');
             html.push('</div>');
             html.push('<div class="fht-cell"></div>');
             html.push('<div class="fht-cell"></div>');
             html.push('</div>');
             html.push('</div>');