feat: add extra caller property to onSelectedRowsChanged (#659)

- this is to cover a special use case that we have, in which the user can click a row which will possibly trigger other rows to be selected (Tree Data grid), so we basically dynamically change row selection following certain logic (via `setSelectedRows`) and the current code was problematic because SlickRowSelectionModel is also calling `setSelectedRows` and we had no way of knowing if the selection was made by the user or dynamically by the code, this PR adds a `caller` property which tells us who called the row selection. - also added extra properties, 3x in total: (`caller`, `changedSelectedRows` and `changedUnselectedRows`), this makes my code a lot cleaner since I often have to add extra code to know the last changes
6pac · Dec 6, 2021 · e693a0c · e693a0c
1 parent c06e3a3
commit e693a0c
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 16 deletions.
diff --git a/plugins/slick.cellselectionmodel.js b/plugins/slick.cellselectionmodel.js
@@ -82,15 +82,20 @@
       return !areDifferent;
     }
 
-    function setSelectedRanges(ranges) {
+    function setSelectedRanges(ranges, caller) {
       // simple check for: empty selection didn't change, prevent firing onSelectedRangesChanged
       if ((!_ranges || _ranges.length === 0) && (!ranges || ranges.length === 0)) { return; }
 
       // if range has not changed, don't fire onSelectedRangesChanged
       var rangeHasChanged = !rangesAreEqual(_ranges, ranges);
 
       _ranges = removeInvalidRanges(ranges);
-      if (rangeHasChanged) { _self.onSelectedRangesChanged.notify(_ranges); }
+      if (rangeHasChanged) { 
+        // provide extra "caller" argument through SlickEventData to avoid breaking pubsub event that only accepts an array of selected range
+        var eventData = new Slick.EventData();
+        Object.defineProperty(eventData, 'detail', { writable: true, configurable: true, value: { caller: caller || "SlickCellSelectionModel.setSelectedRanges" } });
+        _self.onSelectedRangesChanged.notify(_ranges, eventData); 
+      }
     }
 
     function getSelectedRanges() {

diff --git a/plugins/slick.checkboxselectcolumn.js b/plugins/slick.checkboxselectcolumn.js
@@ -137,7 +137,7 @@
           var remIdx = selectedRows.indexOf(removeList[i]);
           selectedRows.splice(remIdx, 1);
         }
-        _grid.setSelectedRows(selectedRows);
+        _grid.setSelectedRows(selectedRows, "click.cleanup");
       }
     }
 
@@ -179,9 +179,9 @@
       if (_selectedRowsLookup[row]) {
         _grid.setSelectedRows($.grep(_grid.getSelectedRows(), function (n) {
           return n != row;
-        }));
+        }), "click.toggle");
       } else {
-        _grid.setSelectedRows(_grid.getSelectedRows().concat(row));
+        _grid.setSelectedRows(_grid.getSelectedRows().concat(row), "click.toggle");
       }
       _grid.setActiveCell(row, getCheckboxColumnCellIndex());
     }
@@ -193,7 +193,7 @@
           addRows[addRows.length] = rowArray[i];
         }
       }
-      _grid.setSelectedRows(_grid.getSelectedRows().concat(addRows));
+      _grid.setSelectedRows(_grid.getSelectedRows().concat(addRows), "SlickCheckboxSelectColumn.selectRows");
     }
 
     function deSelectRows(rowArray) {
@@ -205,7 +205,7 @@
       }
       _grid.setSelectedRows($.grep(_grid.getSelectedRows(), function (n) {
         return removeRows.indexOf(n) < 0;
-      }));
+      }), "SlickCheckboxSelectColumn.deSelectRows");
     }
 
     function handleHeaderClick(e, args) {
@@ -226,9 +226,9 @@
               rows.push(i);
             }
           }
-          _grid.setSelectedRows(rows);
+          _grid.setSelectedRows(rows, "click.selectAll");
         } else {
-          _grid.setSelectedRows([]);
+          _grid.setSelectedRows([], "click.selectAll");
         }
         e.stopPropagation();
         e.stopImmediatePropagation();

diff --git a/plugins/slick.rowselectionmodel.js b/plugins/slick.rowselectionmodel.js
@@ -95,14 +95,20 @@
     }
 
     function setSelectedRows(rows) {
-      setSelectedRanges(rowsToRanges(rows));
+      setSelectedRanges(rowsToRanges(rows), "SlickRowSelectionModel.setSelectedRows");
     }
 
-    function setSelectedRanges(ranges) {
+    function setSelectedRanges(ranges, caller) {
       // simple check for: empty selection didn't change, prevent firing onSelectedRangesChanged
-      if ((!_ranges || _ranges.length === 0) && (!ranges || ranges.length === 0)) { return; }
+      if ((!_ranges || _ranges.length === 0) && (!ranges || ranges.length === 0)) { 
+        return; 
+      }
       _ranges = ranges;
-      _self.onSelectedRangesChanged.notify(_ranges);
+
+      // provide extra "caller" argument through SlickEventData to avoid breaking pubsub event that only accepts an array of selected range
+      var eventData = new Slick.EventData();
+      Object.defineProperty(eventData, 'detail', { writable: true, configurable: true, value: { caller: caller || "SlickRowSelectionModel.setSelectedRanges" } });
+      _self.onSelectedRangesChanged.notify(_ranges, eventData);
     }
 
     function getSelectedRanges() {

diff --git a/slick.grid.js b/slick.grid.js
@@ -2851,7 +2851,17 @@ if (typeof Slick === "undefined") {
       setCellCssStyles(options.selectedCellCssClass, hash);
 
       if (simpleArrayEquals(previousSelectedRows, selectedRows)) {
-        trigger(self.onSelectedRowsChanged, {rows: getSelectedRows(), previousSelectedRows: previousSelectedRows}, e);
+        var caller = e && e.detail && e.detail.caller || 'click';
+        var newSelectedAdditions = getSelectedRows().filter(function(i) { return previousSelectedRows.indexOf(i) < 0 });
+        var newSelectedDeletions = previousSelectedRows.filter(function(i) { return getSelectedRows().indexOf(i) < 0 });
+
+        trigger(self.onSelectedRowsChanged, {
+          rows: getSelectedRows(),
+          previousSelectedRows: previousSelectedRows,
+          caller : caller,
+          changedSelectedRows: newSelectedAdditions,
+          changedUnselectedRows: newSelectedDeletions
+        }, e);
       }
     }
 
@@ -5926,12 +5936,12 @@ if (typeof Slick === "undefined") {
       return selectedRows.slice(0);
     }
 
-    function setSelectedRows(rows) {
+    function setSelectedRows(rows, caller) {
       if (!selectionModel) {
         throw new Error("SlickGrid Selection model is not set");
       }
       if (self && self.getEditorLock && !self.getEditorLock().isActive()) {
-        selectionModel.setSelectedRanges(rowsToRanges(rows));
+        selectionModel.setSelectedRanges(rowsToRanges(rows), caller || "SlickGrid.setSelectedRows");
       }
     }