Fix wenzhixin#3150, Fix wenzhixin#3310

Examples: http://jsfiddle.net/e3nk137y/17866/ , http://jsfiddle.net/e3nk137y/17867/
ly-sniper · Dec 19, 2017 · fa757c9 · fa757c9
1 parent 8cbdbad
commit fa757c9
Show file tree

Hide file tree

Showing 8 changed files with 114 additions and 5 deletions.
diff --git a/docs/_i18n/en/documentation/localizations.md b/docs/_i18n/en/documentation/localizations.md
@@ -65,6 +65,11 @@
         <td>formatAllRows</td>
         <td>-</td>
         <td>'All'</td>
+    </tr>
+    <tr>
+        <td>formatFullscreen</td>
+        <td>-</td>
+        <td>'Fullscreen'</td>
     </tr>
 	</tbody>
 </table>

diff --git a/docs/_i18n/en/documentation/table-options.md b/docs/_i18n/en/documentation/table-options.md
@@ -411,6 +411,13 @@ The table options are defined in `jQuery.fn.bootstrapTable.defaults`.
         <td>false</td>
         <td>True to show the pagination switch button.</td>
     </tr>
+    <tr>
+        <td>showFullscreen</td>
+        <td>data-show-fullscreen</td>
+        <td>Boolean</td>
+        <td>false</td>
+        <td>True to show the fullscreen button.</td>
+    </tr>
     <tr>
         <td>minimumCountColumns</td>
         <td>data-minimum-count-columns</td>

diff --git a/docs/_i18n/es/documentation/localizations.md b/docs/_i18n/es/documentation/localizations.md
@@ -66,5 +66,43 @@
         <td>--/td>
         <td>'All'</td>
     </tr>
+    <tr>
+        <td>formatFullscreen</td>
+        <td>-</td>
+        <td>'Fullscreen'</td>
+    </tr>
     </tbody>
-</table>
+</table>
+
+---
+
+**PS:**
+
+Podemos importar  [all locale files](https://github.com/wenzhixin/bootstrap-table/tree/master/src/locale) lo que necesita:
+
+```html
+<script src="bootstrap-table-en-US.js"></script>
+<script src="bootstrap-table-zh-CN.js"></script>
+...
+```
+
+Y luego utilice este código JavaScript para cambiar el lenguaje:
+
+```js
+$.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales['en-US']);
+// $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales['zh-CN']);
+// ...
+```
+
+O utilice los data attributes para configurar el lenguaje:
+
+```html
+<table data-toggle="table" data-locale="en-US">
+</table>
+```
+
+O utilice este JavaScript para configurar el lenguaje:
+
+```js
+$('table').bootstrapTable({locale:'en-US'});
+```
diff --git a/docs/_i18n/es/documentation/table-options.md b/docs/_i18n/es/documentation/table-options.md
@@ -337,6 +337,13 @@ Las opciones de la tabla están definidas en `jQuery.fn.bootstrapTable.defaults`
         <td>false</td>
         <td>True para mostrar el botón de mostrar/ocultar la paginación.</td>
     </tr>
+    <tr>
+        <td>showFullscreen</td>
+        <td>data-show-fullscreen</td>
+        <td>Boolean</td>
+        <td>false</td>
+        <td>True para mostrar botón de fullscreen.</td>
+    </tr>
     <tr>
         <td>minimumCountColumns</td>
         <td>data-minimum-count-columns</td>

diff --git a/docs/_i18n/zh-cn/documentation/localizations.md b/docs/_i18n/zh-cn/documentation/localizations.md
@@ -65,6 +65,11 @@
         <td>formatAllRows</td>
         <td>-</td>
         <td>'All'</td>
+    </tr>
+    <tr>
+        <td>formatFullscreen</td>
+        <td>-</td>
+        <td>'Fullscreen'</td>
     </tr>
 	</tbody>
 </table>

diff --git a/docs/_i18n/zh-cn/documentation/table-options.md b/docs/_i18n/zh-cn/documentation/table-options.md
@@ -362,6 +362,13 @@
         <td>false</td>
         <td>是否显示切换分页按钮。</td>
     </tr>
+    <tr>
+        <td>showFullscreen</td>
+        <td>data-show-fullscreen</td>
+        <td>Boolean</td>
+        <td>false</td>
+        <td>True to show the fullscreen button.</td>
+    </tr>
     <tr>
         <td>minimumCountColumns</td>
         <td>data-minimum-count-columns</td>

diff --git a/src/bootstrap-table.css b/src/bootstrap-table.css
@@ -311,3 +311,12 @@ div.fixed-table-scroll-outer {
     display: block;
     clear: both;
 }
+
+.fullscreen {
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 1050;
+    width: 100%!important;
+    background: #FFF;
+}
diff --git a/src/bootstrap-table.js b/src/bootstrap-table.js
@@ -25,7 +25,8 @@
                 toggle: 'glyphicon-list-alt icon-list-alt',
                 columns: 'glyphicon-th icon-th',
                 detailOpen: 'glyphicon-plus icon-plus',
-                detailClose: 'glyphicon-minus icon-minus'
+                detailClose: 'glyphicon-minus icon-minus',
+                fullscreen: 'glyphicon-fullscreen'
             },
             pullClass: 'pull',
             toobarDropdowHtml: ['<ul class="dropdown-menu" role="menu">', '</ul>'],
@@ -43,7 +44,8 @@
                 toggle: 'fa-toggle-on',
                 columns: 'fa-th-list',
                 detailOpen: 'fa-plus',
-                detailClose: 'fa-minus'
+                detailClose: 'fa-minus',
+                fullscreen: 'fa-arrows-alt'
             },
             pullClass: 'float',
             toobarDropdowHtml: ['<div class="dropdown-menu dropdown-menu-right">', '</div>'],
@@ -360,6 +362,7 @@
         showPaginationSwitch: false,
         showRefresh: false,
         showToggle: false,
+        showFullscreen: false,
         buttonsAlign: 'right',
         smartDisplay: true,
         escape: false,
@@ -524,6 +527,9 @@
         formatToggle: function () {
             return 'Toggle';
         },
+        formatFullscreen: function () {
+            return 'Fullscreen';
+        },            
         formatColumns: function () {
             return 'Columns';
         },
@@ -1123,6 +1129,11 @@
                 '</button>');
         }
 
+        if (this.options.showFullscreen) {
+            this.$toolbar.find('button[name="fullscreen"]')
+                .off('click').on('click', $.proxy(this.toggleFullscreen, this));
+        }
+
         if (this.options.showRefresh) {
             html.push(sprintf('<button class="btn' +
                     sprintf(' btn-%s', this.options.buttonsClass) +
@@ -1143,6 +1154,16 @@
                 '</button>');
         }
 
+        if (this.options.showFullscreen) {
+            html.push(sprintf('<button class="btn' +
+                    sprintf(' btn-%s', this.options.buttonsClass) +
+                    sprintf(' btn-%s', this.options.iconSize) +
+                    '" type="button" name="fullscreen" aria-label="fullscreen" title="%s">',
+                    this.options.formatFullscreen()),
+                    sprintf('<i class="%s %s"></i>', this.options.iconsPrefix, this.options.icons.fullscreen),
+                    '</button>');
+        }
+
         if (this.options.showColumns) {
             html.push(sprintf('<div class="keep-open btn-group" title="%s">',
                     this.options.formatColumns()),
@@ -1272,7 +1293,13 @@
 
         this.options.pageNumber = 1;
         this.initSearch();
-        this.updatePagination();
+        if (event.firedByInitSearchText) {
+            if (this.options.sidePagination === 'client') {
+                this.updatePagination();
+            }
+        } else {
+            this.updatePagination();
+        }
         this.trigger('search', text);
     };
 
@@ -2115,7 +2142,7 @@
             if (this.options.searchText !== '') {
                 var $search = this.$toolbar.find('.search input');
                 $search.val(this.options.searchText);
-                this.onSearch({currentTarget: $search});
+                this.onSearch({currentTarget: $search, firedByInitSearchText: true});
             }
         }
     };
@@ -2923,6 +2950,10 @@
         this.updatePagination();
     };
 
+    BootstrapTable.prototype.toggleFullscreen = function () {
+        this.$el.closest('.bootstrap-table').toggleClass('fullscreen');
+    };
+
     BootstrapTable.prototype.refresh = function (params) {
         if (params && params.url) {
             this.options.url = params.url;