menu
Channels
Team

Remove 'Enter' KeyListener on Dialog which extends AbstractDialog

June 4, 2020 at 1:39pm

Remove 'Enter' KeyListener on Dialog which extends AbstractDialog

June 4, 2020 at 1:39pm
Hi, I have a theia dialog component which extends AbstractDialog. I'd like to remove the enter keypress functionality altogether and only use the button onClick event to perform necessary actions. I see this method in the AbstractDIalog class: protected addAcceptAction<K extends keyof HTMLElementEventMap>(element: HTMLElement, ...additionalEventTypes: K[]): void { this.addKeyListener(element, Key.ENTER, () => this.accept(), ...additionalEventTypes); }
How can I remove this key listener? Thanks in advance.

June 4, 2020 at 3:23pm
I think it comes rather from the DialogOverlayService constructor
constructor() {
addKeyListener(document.body, Key.ENTER, e => this.handleEnter(e));
addKeyListener(document.body, Key.ESCAPE, e => this.handleEscape(e));
}
  • reply
  • like
This will call handleEnter of the current AbstractDialog. So if you override that function and leave the implementation blank you should have the behavior you want.
like-fill
1
  • reply
  • like
Thanks, I had to override the addAcceptAction method as well as handleEnter to completely eliminate the enter key functionality. Basically, it looks like handleEnter method is invoked when the dialog overlay is in focus and addAcceptAction is triggered when it's blurred/unfocused. So I had to override both.
  • reply
  • like

June 5, 2020 at 2:08am
I would have thought that handleEnter is used for enter key press event from anywhere, regardless of what is focused (since it's added to the body) and the addAcceptAction is used for when the button has the focus and therefore receives key events, so as long as the button is not focused it won't react to enter key event.
  • reply
  • like
private
This channel has been archived