Submit external form on key press Enter

[James]

In you external form example:

https://www.telerik.com/kendo-angular-ui/components/grid/editing/external-editing/

what's the best way to get the form to submit on enter. Cancel works with Esc key.

[Martin]

Hi James,

Indeed, there is no built-in option to submit the form using Enter key. To achieve the desired behavior, we should use our custom JavaScript logic. The most straight-forward approach is to listen for Enter key presses.

Use the keydown event in the <kendo-dialog> component. In the event handler, check the pressed key and call the onSave() method when necessary:

template:
<kendo-dialog
         ...
        (keydown)="onKeyDown($event)"
        >
</kendo-dialog>
...

export class GridEditFormComponent {

  public onSave(e): void {
    ....
  }

  private onKeyDown(pressedKey) {
    if (pressedKey.key==="Enter") {
      this.onSave(pressedKey);
    }
  }

}

Check the following example which demonstrates External form which is submitted using the Enter key:

https://stackblitz.com/edit/angular-ird5wx?file=app/app.component.ts

I hope this helps. Let me know if I am missing something or any further assistance is required.

Regards,
Martin
Progress Telerik