Submit Button activated pressing Enter

Discussion Ask a question
,
1

Hi to all,

I’d like to have the possibility to activate a submit button just pressing the ENTER key.

I have 3 input box in my page, 2 of this fill automaticaly, one (#input1) is manual fill box.
If I press the #button1 all the inputboxes are insert on my database (#dataset1).
But there’s a way to insert data on db just pressing Enter on my Keyboard?

Thanks for the help.

1349×500 56.7 KB

2

Just use onKeyPress instead of onClick.

However, note that onKeyPress will be for your text element itself, whereas onClick will be for your button.

See here in this old forum post for more info.
https://www.wix.com/corvid/forum/community-discussion/input-onkeypress-function-working-only-after-clicking-away

Also, using onKeyPress you will want to add a little time delay on as well.
https://www.wix.com/corvid/forum/corvid-tips-and-updates/give-the-textinput-onkeypress-function-some-time

3

Thank you!

So there isn’t a way to activate the submit button with enter key. I can only use onKeyPress on input element but does’t work for all my input boxes.

I need something different because I need to insert many DCIT numbers in my db and click on button1 every time isn’t smart in my opinion.

4

@Andrea Paderi
You can use something like this:

export function input1_keyPress(event) {
 console.log("You pressed" + event.key);
 if (event.key === "Enter") {
        button1();    // pressing <Enter> activates the button1() function ... same effect as clicking the button
    } else {
        //
    }
}

I think this will do what you intend to accomplish.

1 Like
5

@sasasinolocicero

You can as Brainstorm has added below for you, it is just that must onKeyPress event handlers are used on the user input element itself and not the submit button which most people will setup as onClick.

You can in theory use both if you wanted too, however for your request of having the button submit it instead, then just use the code below.