Tag-like UI element

Question

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:

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?

Answer 1

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

Answer 2

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/

Answer 3

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

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