How to avoid <input /> field from showing `next` option instead of `go` (On mobile keyboard)

Question

Having an input field like:

<input type="text" />

Will automatically (on Android) change the Enter option on your keyboard to say Next, and it will jump to the next field.

How to avoid this behaviour?

In my case I'm using an input field to add tags to (or Chips), which works fine on its own on mobile because the appropriate event is fired.

But when the Next button shows, it seems to simulate pressing tab on your keyboard, i.e. it goes to the next field. I need it to behave as submit instead.

(Also can't find any relevant specs on this keyboard displaying behaviour, it seems to be a free-formed android specific thing)

Answer 1

The correct way to fix this is to use the enterkeyhint attribute, for instance:

<input type="text" enterkeyhint="done"/>

Answer 2

Changing the input type to search works fine but I found another alternative to solve it keeping original input type. Just adding the attribute tabindex="-1" in all form inputs.

Answer 3

One solution or workaround is to set the type to search:

<input type="search" />

It's a bit odd to have to press a magnifying glass to add a tag in my usecase, but it works. And any of the other property values don't seem to produce the same result as I want: https://www.w3schools.com/html/html_form_input_types.asp

Like submit will trigger submitting the form, not the field, afaik.