bugfix(event): change onCellChange/onCellClick event to Keyboard/Mouse

Author: ghiscoding-SE

src/app/modules/angular-slickgrid/models/column.interface.ts

@@ -146,10 +146,10 @@ export interface Column {
   name?: string;
 
   /** an event that can be used for triggering an action after a cell change */
-  onCellChange?: (e: Event, args: OnEventArgs) => void;
+  onCellChange?: (e: KeyboardEvent | MouseEvent, args: OnEventArgs) => void;
 
   /** an event that can be used for triggering an action after a cell click */
-  onCellClick?: (e: Event, args: OnEventArgs) => void;
+  onCellClick?: (e: KeyboardEvent | MouseEvent, args: OnEventArgs) => void;
 
   /** column output type */
   outputType?: FieldType;

src/app/modules/angular-slickgrid/services/gridEvent.service.ts

@@ -1,4 +1,4 @@
-import { OnEventArgs, CellArgs, SlickEventHandler } from './../models/index';
+import { CellArgs, Column, GridOption, OnEventArgs, SlickEventHandler } from './../models/index';
 
 // using external non-typed js libraries
 declare var Slick: any;
@@ -17,11 +17,11 @@ export class GridEventService {
   /* OnCellChange Event */
   bindOnCellChange(grid: any, dataView: any) {
     // subscribe to this Slickgrid event of onCellChange
-    this._eventHandler.subscribe(grid.onCellChange, (e: Event, args: CellArgs) => {
+    this._eventHandler.subscribe(grid.onCellChange, (e: KeyboardEvent | MouseEvent, args: CellArgs) => {
       if (!e || !args || !grid || args.cell === undefined || !grid.getColumns || !grid.getDataItem) {
         return;
       }
-      const column = grid.getColumns()[args.cell];
+      const column: Column = grid.getColumns()[args.cell];
 
       // if the column definition has a onCellChange property (a callback function), then run it
       if (typeof column.onCellChange === 'function') {
@@ -43,12 +43,12 @@ export class GridEventService {
 
   /* OnClick Event */
   bindOnClick(grid: any, dataView: any) {
-    this._eventHandler.subscribe(grid.onClick, (e: Event, args: CellArgs) => {
+    this._eventHandler.subscribe(grid.onClick, (e: KeyboardEvent | MouseEvent, args: CellArgs) => {
       if (!e || !args || !grid || args.cell === undefined || !grid.getColumns || !grid.getDataItem) {
         return;
       }
-      const column = grid && grid.getColumns && grid.getColumns()[args.cell];
-      const gridOptions = grid && grid.getOptions && grid.getOptions() || {};
+      const column: Column = grid && grid.getColumns && grid.getColumns()[args.cell];
+      const gridOptions: GridOption = grid && grid.getOptions && grid.getOptions() || {};
 
       // only when using autoCommitEdit, we will make the cell active (in focus) when clicked
       // setting the cell as active as a side effect and if autoCommitEdit is set to false then the Editors won't save correctly