533

What solutions accomplish the same auto-completion that SO uses for entering tags?

There are plugins that can handle one word but I haven't seen any that handle multiple words.

Improve this question
7
  • Voting to close as tool rec. Commented May 30, 2016 at 17:10
  • 1
    I've created the best - github.com/yairEO/tagify Commented Oct 13, 2016 at 22:00
  • @vsync Added it to the list in the first answer. Unfortunately can't link directly to codepen.io due to not having any code in the answer Commented Oct 13, 2016 at 22:07
  • @JoePhilllips - maybe it will accept google URL shortened ones Commented Oct 13, 2016 at 22:51
  • @JoePhilllips - My plugin is better than the best one on the top of the list, and deserves to be on the top and I have good selling points for that. currently the top one on the list is bloated (x4 than mine), uses extra input element (bad for form serialization) and does not support commas or pasting tags with them. it does offer some features which are nice but unneeded for most cases. autocomplete should be used desperately IMHO Commented Oct 13, 2016 at 22:55

6 Answers 6

Reset to default
777

In order of activity, demos/examples available, and simplicity:

Related:

Improve this answer
Sign up to request clarification or add additional context in comments.

22 Comments

On IE9 it is giving "Line: 18 Error: Object doesn't support property or method 'tagit'"
Anyone looking for the most up to date version, documentation and more extensive examples of this amazing plugin should go here and fork away: github.com/aehlke/tag-it
update: I think magicsuggest is the best option now.
tag-it is overrated. Requiring jquery for a simple tag system is too much, but requiring as well jQuery UI and jquery UI CSS is just mad nowadays. Not worth it.
@scniro I ended up using jquery.tagsinput because I do not mind using jQuery which is already being used in my project. I just though it was mad to ask for jquery UI and CSS.
|
63

Bootstrap: If you are using Bootstrap. This is a really good one: Select2

Also, TokenInput is an interesting one. First, it does not depend on jQuery-UI, second its config is very smooth.

The only issue I had it does not support free-tagging natively. So, I have to return the query-string back to client as a part of response JSON.

As @culithay mentioned in the comment, TokenInput supports a lot of features to customize. And highlight of some feature that the others don't have:

  • tokenLimit: The maximum number of results allowed to be selected by the user. Use null to allow unlimited selections
  • minChars: The minimum number of characters the user must enter before a search is performed.
  • queryParam: The name of the query param which you expect to contain the search term on the server-side

Thanks culithay for the input.

Improve this answer

4 Comments

TokenInput looks like it's exactly what I've been looking for: user types some stuff in, performs a search on the server, user can select a searched for element, rinse and repeat.
TokenInput supports a lot of features to customize. And I highlight some feature that the others don't have. - tokenLimit: The maximum number of results allowed to be selected by the user. Use null to allow unlimited selections - minChars: The minimum number of characters the user must enter before a search is performed. - queryParam: The name of the query param which you expect to contain the search term on the server-side
How to add new free tags with it: stackoverflow.com/questions/28656977/… Hard :-(
Good one. Not supporting free-tagging is not a big issue, since it can be easily overcome.
8

This originally answered a supplemental question about the wisdom of downloading jQuery versus accessing it via a CDN, which is no longer present...

To answer the thing about Google. I have moved over to accessing JQuery and most other of these sorts of libraries via the corresponding CDN in my sites.

As more people do this means that it's more likely to be cached on user's machines, so my vote goes for good idea.

In the five years since I first offered this, it has become common wisdom.

Improve this answer

4 Comments

We roll this out as part of our default templates as well. Google can serve this code zipped and out of a CDN faster than us, plus if there's even a 2% chance that a visitor has this cached it's better than no chance at all.
How is this the answer to the original question?
The last part 'Also,...' asks whether linking to the Google version is a good or bad idea, and my answer is that it is an increasingly good idea.
@Derek I don't think I had any other acceptable answers when I originally asked it. That has since changed.
5

Another excellent plugin can be found at https://documentcloud.github.io/visualsearch/

Improve this answer

Comments

2

Check this plugin:

How to use AJAX for loading the tags https://stackoverflow.com/a/7662534/1078027

Improve this answer

1 Comment

The demo page is dead here too
1

We just open-sourced this jquery plug-in Github: tactivos/jquery-sew.

Improve this answer

3 Comments

While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid (and downvoted) if the linked page changes. See How To Answer for why it is important.
The demo page is dead.
Agree with @EdwardOlamisan. The demo page results in HTTP code 403.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.