18

There is a UI element that I have seen in several places, but in trying to find an implementation for it, I realized I don't know how to correctly refer to it. The element that I am thinking of is a modified autocomplete text field, such as in Evernote's tags field on iOS or Gmails email address fields.

Here's an example:

enter image description here

Specifically, these appear as simple autocomplete text fields. However, when an element autocompletes, or a delimiter like a comma is typed, the element becomes an atomic 'bubble' which can no longer individually be modified, but the user can continue to enter a new autocomplete terms in the same field.

Any idea what these are kinds of fields are called?

13

Sometimes it's called Token input. For example here: http://loopj.com/jquery-tokeninput/

6

I'm not sure there is actually name for the field itself, but what you are referring to appears to be a tag editing widget applied to the field.

A link to an implementation of it called 'Tag-it!' is here: http://aehlke.github.io/tag-it/

0

You're looking for something similar to the "Multiple Select" functionality of the "Chosen" JQuery plugin.

http://harvesthq.github.io/chosen/

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.