[FR] Pressing Enter key in input fields of forms regardless of input type should execute the Submit action

[shapirus]

Please verify that this feature request has NOT been suggested before.

• I checked and didn't find a similar feature request

Problem statement

I'm not really sure if it is to be treated as a bug or a feature request. When I edit a part's parameter where the input type is string (that can be typed), then pressing Enter when that input field has focus submits the form.

If, however, the field is a drop-down list with predefined choices, then pressing Enter when that field is focused has no effect (at least in Firefox).

It would be nice if the Enter key worked to submit the form in that case as well (without having to reach for the mouse and aim for that Submit button), as that's a standard and normally expected UI behavior.

Suggested solution

Will probably need a dedicated JS handler to get it done, not sure what modern frontend tech has to offer.

Describe alternatives you've considered

n/a

Examples of other systems

No response

Do you want to develop this?

• I want to develop this.

[SchrodingersGat]

Any changes to the forms / frontend (unless to address critical bugs) will only be applied to the new react interface

Please checkout the new interface at https://demo.inventree.org/platform to see if the new forms interface has the same "issue"

[shapirus]

Please checkout the new interface at https://demo.inventree.org/platform to see if the new forms interface has the same "issue"

It is actually worse there: pressing the Enter key in the Data input field has no effect regardless of whether the value is a scalar or a choice type, and the user is forced to reach for the mouse or use touchpad to click the Sumbit button.

[SchrodingersGat]

Ok, I think we should change the scope of this issue to just the new interface then. Do you mind editing the title of this issue appropriately?

[shapirus]

Do you mind editing the title of this issue appropriately?

done!

[github-actions]

This issue seems stale. Please react to show this is still important.

[shapirus]

This issue seems stale. Please react to show this is still important.

...still important, for whenever it can be implemented.

[timmyhadwen]

@SchrodingersGat Looking at doing this at the moment. From what I can see if will be difficult to implement a "modal wide" Enter keydown event -> submit flow. If you can think of an easy way to achieve this let me know and I can look into it.

Failing that, is this going to require a keyDown event handler in each form field type, which calls back through (a few layers) to the form and runs form.submitForm?

PS: Also the first time Im opening this code base so apologies if I'm just not seeing the easy way to achieve this.

[timmyhadwen]

My attempt committed above, my react is rusty. Thoughts and comments welcome.

[SchrodingersGat]

@timmyhadwen thanks for tackling this. I'd suggest that you open a pull request against your branch, so we can review there