diff --git a/src/js/modules/Edit/Edit.js b/src/js/modules/Edit/Edit.js index 95efbd17f..2948faafc 100644 --- a/src/js/modules/Edit/Edit.js +++ b/src/js/modules/Edit/Edit.js @@ -78,6 +78,10 @@ export default class Edit extends Module{ this.subscribe("keybinding-nav-up", this.navigateUp.bind(this, undefined)); this.subscribe("keybinding-nav-down", this.navigateDown.bind(this, undefined)); } + + // Add event handlers for other modules to access editing state and functionality + this.subscribe("edit-check-editing", this.checkEditing.bind(this)); + this.subscribe("edit-cancel-cell", this.cancelEditEvent.bind(this)); if(Object.keys(this.table.options).includes("editorEmptyValue")){ this.convertEmptyValues = true; @@ -451,6 +455,19 @@ export default class Edit extends Module{ return this.currentCell ? this.currentCell.getComponent() : false; } + checkEditing(){ + return !!this.currentCell; + } + + cancelEditEvent(){ + if(this.currentCell){ + this.cancelEdit(); + return true; + } + return false; + } + + clearEditor(cancel){ var cell = this.currentCell, cellEl; diff --git a/src/js/modules/SelectRange/SelectRange.js b/src/js/modules/SelectRange/SelectRange.js index 12fad4a02..300ba6a40 100644 --- a/src/js/modules/SelectRange/SelectRange.js +++ b/src/js/modules/SelectRange/SelectRange.js @@ -33,6 +33,7 @@ export default class SelectRange extends Module { this.registerTableOption("selectableRangeClearCells", false); //allow clearing of active range this.registerTableOption("selectableRangeClearCellsValue", undefined); //value for cleared active range this.registerTableOption("selectableRangeAutoFocus", true); //focus on a cell after resetRanges + this.registerTableOption("selectableRangeBlurEditOnNavigate", undefined); //prevent editing on navigation this.registerTableFunction("getRangesData", this.getRangesData.bind(this)); this.registerTableFunction("getRanges", this.getRanges.bind(this)); @@ -132,8 +133,8 @@ export default class SelectRange extends Module { this.subscribe("edit-editor-clear", this.finishEditingCell.bind(this)); this.subscribe("edit-blur", this.restoreFocus.bind(this)); - this.subscribe("keybinding-nav-prev", this.keyNavigate.bind(this, "left")); - this.subscribe("keybinding-nav-next", this.keyNavigate.bind(this, "right")); + this.subscribe("keybinding-nav-prev", this.keyNavigate.bind(this, "prev")); + this.subscribe("keybinding-nav-next", this.keyNavigate.bind(this, "next")); this.subscribe("keybinding-nav-left", this.keyNavigate.bind(this, "left")); this.subscribe("keybinding-nav-right", this.keyNavigate.bind(this, "right")); this.subscribe("keybinding-nav-up", this.keyNavigate.bind(this, "up")); @@ -401,6 +402,25 @@ export default class SelectRange extends Module { /////////////////////////////////// keyNavigate(dir, e){ + if(this.options("selectableRangeBlurEditOnNavigate")){ + const isEditing = this.chain("edit-check-editing"); + + if(isEditing){ + if(dir === 'next' || dir === 'prev'){ + this.dispatch("edit-cancel-cell"); + }else{ + // Prevent navigating while editing except for next/prev + return false; + } + } + } + + if (dir === 'prev') { + dir = 'left'; + } else if (dir === 'next') { + dir = 'right'; + } + if(this.navigate(false, false, dir)){ e.preventDefault(); }