Fix #3: add loading with formatLoadingMessage function.

src/bootstrap-table.css

@@ -124,6 +124,18 @@
     cursor: default;
 }
 
+.fixed-table-loading {
+    display: none;
+    position: absolute;
+    top: 38px;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 10000;
+    background-color: #fff;
+    text-align: center;
+}
+
 /* support bootstrap 2 */
 .fixed-table-body thead th .th-inner {
     box-sizing: border-box;

src/bootstrap-table.js

@@ -66,6 +66,9 @@
         showColumns: false,
         idField: undefined,
 
+        formatLoadingMessage: function() {
+            return 'Loading, please wait…';
+        },
         formatRecordsPerPage: function(pageNumber) {
             return sprintf('%s records per page', pageNumber);
         },
@@ -103,7 +106,11 @@
                 '<div class="fixed-table-toolbar"></div>',
                 '<div class="fixed-table-container">',
                     '<div class="fixed-table-header"></div>',
-                    '<div class="fixed-table-body"></div>',
+                    '<div class="fixed-table-body">',
+                        '<div class="fixed-table-loading">',
+                            this.options.formatLoadingMessage(),
+                        '</div>',
+                    '</div>',
                     '<div class="fixed-table-pagination"></div>',
                 '</div>',
             '</div>'].join(''));
@@ -111,6 +118,7 @@
         this.$container.insertAfter(this.$el);
         this.$container.find('.fixed-table-body').append(this.$el);
         this.$container.after('<div class="clearfix"></div>');
+        this.$loading = this.$container.find('.fixed-table-loading');
 
         this.$el.addClass(this.options.classes);
         if (this.options.striped) {
@@ -584,6 +592,7 @@
         if (!this.options.url) {
             return;
         }
+        this.$loading.show();
         $.ajax({
             type: this.options.method,
             url: this.options.url,
@@ -592,6 +601,9 @@
             dataType: 'json',
             success: function(data) {
                 that.load(data);
+            },
+            complete: function() {
+                that.$loading.hide();
             }
         });
     };
@@ -626,12 +638,6 @@
     BootstrapTable.prototype.resetView = function() {
         var header = this.header;
 
-        this.$header.find('.th-inner').each(function(i) {
-            $(this).attr('style', header.styles[i])
-                .css('position', 'absolute')
-                .css('width', ($(this).parent().width()) + 'px'); // padding: 8px
-        });
-
         this.$selectAll.prop('checked', this.$selectItem.length > 0 &&
             this.$selectItem.length === this.$selectItem.filter(':checked').length);
 
@@ -642,6 +648,14 @@
 
             this.$container.find('.fixed-table-container').css('height', height + 'px');
         }
+
+        this.$header.find('.th-inner').each(function(i) {
+            var width = $(this).parent().width();
+            $(this).parent().width(width);
+            $(this).attr('style', header.styles[i])
+                .css('position', 'absolute')
+                .css('width', width + 'px'); // padding: 8px
+        });
     };
 
     BootstrapTable.prototype.load = function(data) {

src/locale/bootstrap-table-en.js

@@ -6,6 +6,9 @@
     'use strict';
 
     $.extend($.fn.bootstrapTable.defaults, {
+        formatLoadingMessage: function() {
+            return 'Loading, please wait…';
+        },
         formatRecordsPerPage: function(pageNumber) {
             return pageNumber + ' records per page';
         },

src/locale/bootstrap-table-en.js.template

@@ -6,6 +6,9 @@
     'use strict';
 
     $.extend($.fn.bootstrapTable.defaults, {
+        formatLoadingMessage: function() {
+            return 'Loading, please wait…';
+        },
         formatRecordsPerPage: function(pageNumber) {
             return pageNumber + ' records per page';
         },

src/locale/bootstrap-table-zh-CN.js

@@ -6,6 +6,9 @@
     'use strict';
 
     $.extend($.fn.bootstrapTable.defaults, {
+        formatLoadingMessage: function() {
+            return '正在努力地加载数据中，请稍候……';
+        },
         formatRecordsPerPage: function(pageNumber) {
             return '每页显示 ' + pageNumber + ' 条记录';
         },

src/locale/bootstrap-table-zh-TW.js

@@ -6,6 +6,9 @@
     'use strict';
 
     $.extend($.fn.bootstrapTable.defaults, {
+        formatLoadingMessage: function() {
+            return '正在努力地加載數據中，請稍候……';
+        },
         formatRecordsPerPage: function(pageNumber) {
             return '每頁顯示 ' + pageNumber + ' 條記錄';
         },