Browse Source

Release the new extension (#2455)

Dennis Hernández 9 years ago
parent
commit
2f73171b71

+ 9 - 17
src/extensions/multiple-selection-row/README.md

@@ -1,11 +1,12 @@
-# Table Mobile
+# Table Multiple Selection Row
 
 Use Plugin: [bootstrap-table-multiple-selection-row](https://github.com/wenzhixin/bootstrap-table/tree/master/src/extensions/multiple-selection-row)
 
 ## Usage
 
 ```html
-<script src="extensions/mobile/bootstrap-table-multiple-selection-row.js"></script>
+<link rel="stylesheet" type="text/css" href="extensions/multiple-selection-row/bootstrap-table-multiple-selection-row.css">
+<script src="extensions/multiple-selection-row/bootstrap-table-multiple-selection-row.js"></script>
 ```
 
 ## Options
@@ -22,20 +23,11 @@ Use Plugin: [bootstrap-table-multiple-selection-row](https://github.com/wenzhixi
 * description: The class that will be applied in the rows selected.
 * default: `multiple-select-row-selected`
 
-### minWidth
+## Methods
 
-* type: Integer
-* description: Set the minimum width when the table will change the view.
-* default: `562`
+### clearAllMultipleSelectionRow
 
-### minHeight
-
-* type: Integer
-* description: Set the minimum height when the table will change the view.
-* default: `undefined`
-
-### columnsHidden
-
-* type: String
-* description: Set the columns fields in this array in order to hide those columns in the cardView mode. Use this way in `data-*` configuration: ` data-columns-hidden="['name', 'description']"` or this way in javascript configuration: `columnsHidden = ['name', 'description']`. 
-* default: `undefined`
+* Clear all the selected rows.
+  * Parameters
+      * It does not receive parameters.
+  * Example: <code> $table.bootstrapTable("clearAllMultipleSelectionRow");</code>

+ 54 - 36
src/extensions/multiple-selection-row/bootstrap-table-multiple-selection-row.js

@@ -8,30 +8,64 @@
 
     'use strict';
 
-    // disable text selection
     document.onselectstart = function() {
         return false;
     };
 
+    var getTableObjectFromCurrentTarget = function (currentTarget) {
+        currentTarget = $(currentTarget);
+        return currentTarget.is("table") ? currentTarget : currentTarget.parents().find(".table");
+    };
+
+    var getRow = function (target) {
+        target = $(target);
+        return target.parent().parent();
+    };
+
+    var onRowClick = function (e) {
+        var that = getTableObjectFromCurrentTarget(e.currentTarget);
+
+        if (window.event.ctrlKey) {
+            toggleRow(e.currentTarget, that, false, false);
+        }
+
+        if (window.event.button === 0) {
+            if (!window.event.ctrlKey && !window.event.shiftKey) {
+                clearAll(that);
+                toggleRow(e.currentTarget, that, false, false);
+            }
+
+            if (window.event.shiftKey) {
+                selectRowsBetweenIndexes([that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow.rowIndex, e.currentTarget.rowIndex], that)
+            }
+        }
+    };
+
+    var onCheckboxChange = function (e) {
+        var that = getTableObjectFromCurrentTarget(e.currentTarget);
+        clearAll(that);
+        toggleRow(getRow(e.currentTarget), that, false, false);
+    };
+
     var toggleRow = function (row, that, clearAll, useShift) {
         if (clearAll) {
             row = $(row);
-            that.options.multipleSelectRowLastSelectedRow = undefined;
-            row.removeClass(that.options.multipleSelectRowCssClass);
-            that.uncheck(row.data("index"));    
+            that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow = undefined;
+            row.removeClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
+            that.bootstrapTable("uncheck", row.data("index"));    
         } else {
-            that.options.multipleSelectRowLastSelectedRow = row;
+            that.bootstrapTable("getOptions").multipleSelectRowLastSelectedRow = row;
             row = $(row);
             if (useShift) {
-                    row.addClass(that.options.multipleSelectRowCssClass);
-                    that.check(row.data("index"));
+                row.addClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
+                that.bootstrapTable("check", row.data("index"));  
             } else {
-                if(row.hasClass(that.options.multipleSelectRowCssClass)) {
-                    row.removeClass(that.options.multipleSelectRowCssClass)
-                    that.uncheck(row.data("index"));
+                if(row.hasClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass)) {
+                    row.removeClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass)
+                    that.bootstrapTable("uncheck", row.data("index"));  
                 } else {
-                    row.addClass(that.options.multipleSelectRowCssClass);
-                    that.check(row.data("index"));
+                    row.addClass(that.bootstrapTable("getOptions").multipleSelectRowCssClass);
+                    that.bootstrapTable("check", row.data("index"));  
                 }
             }
         }
@@ -43,13 +77,13 @@
         });
 
         for (var i = indexes[0]; i <= indexes[1]; i++) {
-            toggleRow(that.options.multipleSelectRowRows[i-1], that, false, true);
+            toggleRow(that.bootstrapTable("getOptions").multipleSelectRowRows[i-1], that, false, true);
         }
     };
 
     var clearAll = function (that) {
-        for (var i = 0; i < that.options.multipleSelectRowRows.length; i++) {
-            toggleRow(that.options.multipleSelectRowRows[i], that, true, false);
+        for (var i = 0; i < that.bootstrapTable("getOptions").multipleSelectRowRows.length; i++) {
+            toggleRow(that.bootstrapTable("getOptions").multipleSelectRowRows[i], that, true, false);
         }
     };
     
@@ -72,30 +106,14 @@
             //Make sure that the internal variables have the correct value
             this.options.multipleSelectRowLastSelectedRow = undefined;
             this.options.multipleSelectRowRows = [];
-
-            var onPostBody = this.options.onPostBody;
-            this.options.onPostBody = function () {
+            
+            this.$el.on("post-body.bs.table", function (e) {
                 setTimeout(function () {
                     that.options.multipleSelectRowRows = that.$body.children();
-                    that.options.multipleSelectRowRows.mousedown(function (e) {
-                        if (window.event.ctrlKey) {
-                            toggleRow(e.currentTarget, that, false, false);
-                        }
-
-                        if (window.event.button === 0) {
-                            if (!window.event.ctrlKey && !window.event.shiftKey) {
-                                clearAll(that);
-                                toggleRow(e.currentTarget, that, false, false);
-                            }
-
-                            if (window.event.shiftKey) {
-                                selectRowsBetweenIndexes([that.options.multipleSelectRowLastSelectedRow.rowIndex, e.currentTarget.rowIndex], that)
-                            }
-                        }
-                    });
-                    onPostBody.apply();
+                    that.options.multipleSelectRowRows.click(onRowClick);
+                    that.options.multipleSelectRowRows.find("input[type=checkbox]").change(onCheckboxChange);
                 }, 1);
-            };
+            });
         }
 
         _init.apply(this, Array.prototype.slice.apply(arguments));