2

Tab Vs Enter key behavior in a form

almost 6 years ago from , Head of UX @Trivago

My colleagues and I had a little argument yesterday over web form standards and I'd like some outside opinions. This is very theoritical but interesting nonetheless:

  • let's consider a form with two input fields (let's call them A and B), that A is currently active but empty, and that B is prefilled for you. Once you typed in field A, would you expect the enter key of your keyboard to submit the form, or to switch to field B? Wouldn't "tab" be the key you'd use to switch?

  • now let's consider the same scenario, but taking in consideration that input field B, while being prefilled, might not reflect the value that you want to submit. Would you still submit the form via hitting the Enter key?

  • Last layer of difficulty to add: both fields contain a suggestion dropdown, from which you could choose a value. Expected behavior would be to have the enter key autocomplete your value from the chosen suggestion. But would the enter key then automatically send you to field B, since your task is complete with field A?

We're talking purely about a desktop experience, and of course a submit button is still available. For the sake of our exercise, we're not considering any mouse input. Once submitted, the user is redirected to another page (it doesn't involve any validation). Our target audience includes all ages and ranges from non tech saavy to power users.

7 comments

  • Marc EdwardsMarc Edwards, almost 6 years ago

    1 — I’d expect enter to submit the form.

    2 — I’d expect enter to submit the form.

    3 — I’d expect enter to accept the autocomplete and for the text in the same field to be selected, allowing the user to retype a different answer.

    3 points
  • Tom GantzerTom Gantzer, almost 6 years ago

    Scenario 1: In my opinion, Enter should submit the form; Tab should switch focus on the inputs.

    Scenario 2: Interesting question. I feel that Enter should still submit the form, but I'd have to question that if a field is prefilled, is it likely that it needs to be changed? If it was left to the default value could this cause problems if users don't change it? If the answer is that it could cause problems, then it probably shouldn't be prefilled to begin with.

    Scenario 3: Another interesting question. My opinion is that it should only auto-complete the field, with Tab used to focus the next field. This is more of a UX question though related to your intended design of the form. Perhaps the form is designed to be filled in quickly, where selecting the next field and trusting that data has been entered correctly is OK. However this might break convention for traditionalists and people who enter data efficiently using a keyboard and expect standard functionality.

    For a detailed UX response, I'd try this question over at the UX StackExchange site; you'd probably get a ton of interesting answers and perspectives.

    1 point
  • Poyi ChenPoyi Chen, almost 6 years ago

    Pressing enter key (not on the dropdown) should submit the form.

    Pressing tab should switch to the next input regardless of content status.

    Press enter key on the dropdown should set the selection and enter the focus state but not submit or change input.

    0 points
  • Chris CChris C, almost 6 years ago
    1. Submit expected

    2. Submit expected

    3. From my experience with other apps and even sites, I would expect enter to select AND submit only if field B's criteria was met (assuming you still have a pre-filled value like in scenario 1 & 2). Otherwise, I would expect it to just make the selection for field A and not move on to the next field (need to Tab to field B).

    0 points