Submit any form with a keyboard shortcut

Say you have a simple form like “Add comment” similar to this image

Add comment form

Now, this is a text-area, so the ENTER key will break rows and will not automatically submit the form to the server.

I want to create a flexible way to send the form to the server with a keyboard shortcut like CTRL+ENTER.

Thanks to an awesome library by Thomas Fuchs called KeyMaster it turned out to be quite simple.

By default, Keymaster ignores all keyboard shortcuts if it’s inside an input or textarea or even a select box, obviously that is not what I wanted or needed.

Luckily, you can override that behavior with a filter function, like so

Now, all you need to do is listen to the event, and when it’s fired, submit the parent form. like so:

That’s it, now every text-input, input or select box can submit the form with this shortcut, it’s super useful and your users will certainly like it.