Semantic-UI icon indicating copy to clipboard operation
Semantic-UI copied to clipboard

[Form] Enter key submits form even when `keyboardShortcuts: false`

Open daneprime8 opened this issue 6 years ago • 3 comments

Creating a form and disabling keyboardShortcuts does not disable the enter key for form submit.

Expected case is that enter key will do nothing.

Testcase

https://jsfiddle.net/skwny/8be03nao/4/

daneprime8 avatar Feb 23 '19 19:02 daneprime8

Not sure if this is a bug or not. I think this setting turns off SUI's custom logic during form submit, but then by default the browser will submit a form when enter is pressed on an input. I think this is just the browser taking over.

andrewleith avatar Mar 13 '20 01:03 andrewleith

I think @andrewleith is right.

I fixed this issue by changing my button from this <button class="ui primary fluid button" type="submit">Submit</button> to <div class="ui primary submit fluid button">Submit</div>

keyboardShortcuts: false worked after these changes

crispycrispycrispy avatar Feb 02 '22 09:02 crispycrispycrispy

@crispycrispycrispy one thing to note is that this will make your button not accessible - a screen reader will not recognize it as a button.

andrewleith avatar Feb 02 '22 11:02 andrewleith