0

I notice that a lot of modern UI components, specifically chip input fields allow a user to hit enter which adds a new chip. Google’s material framework also has an enter event for adding new chips. https://material.angular.io/components/chips/overview

The question is, is this bad UX? Typically the enter button is used to submit a form, provided the other fields are filled in that is. If this is an exception to the rule, what rules does it raise an exception to?

2
  • Related: Submit form on enter without focus (ux.stackexchange.com/questions/98690/…), Behavior of the Enter button in a form (ux.stackexchange.com/questions/36713/…), Hitting enter to submit a form (ux.stackexchange.com/questions/90645/…) and What should ENTER do? (ux.stackexchange.com/questions/864/what-should-enter-do) Jul 13 '20 at 6:46
  • 1
    Although it is historically common for enter to submit a form, I personally would avoid that unless I had a specific reason to do so (i.e. the users asked for it). I think these days it's far too common for people to hit the enter button after they have finished typing something, especially considering how much we use chat applications these days. I would worry that too many users would accidentally submit forms they haven't finished filling in yet. If my form had a single field, I might consider allowing enter to submit the form. I guess really it largely depends on the form.
    – musefan
    Jul 14 '20 at 9:40
0

Here as you asked about the chip component, using the enter key to add chip, the action would be right UX behavior or no.

I would say if you do not set the primary action in place for activities can result in bad UX for the user.

You can solve this problem stepwise.

Step1: Define Actions: for Component and its combination to another component.

In the chip component, you have multiple actions.

  • Adding new chip
  • Deleting added chip
  • submitting a form if you're using the chip component in the form template.

Step2: Set Emphasis of action: I believe the emphasis of work needs to be set for each action.

  1. Primary Action
  2. Secondary Action

Step3: Define User Behaviour: For Each action, you need to define the user's behavior for defined actions based on their emphasis, which should match with the user's mental model.

Eg; The user's Mental Model for submission is, to press enter key.

Eg; if the chip component is not combined with form, its better utilizes the enter key behavioral to assign to defined action based on the emphasis we set.

Tip: And behavior: to press enter key would be a good user behavior for primary action: add selected/typed token or chip.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.