Offer an Enhanced Term Selection Widget Using Autocomplete Deluxe

By: Ivan Zugec
http://webwash.net |   / webwashnet  

Modules:

- Autocomplete Deluxe (https://www.drupal.org/project/autoco...) (7.x-2.x-dev)

Transcript:

The Autocomplete Deluxe module defines a custom widget for the Term reference field. For example, the Tags field on the Article content type is a Term reference field.

Drupal ships with its own auto-complete widget but it is pretty basic. Autocomplete Deluxe offers a more enhanced auto-complete experience and best of all it uses the jQuery UI Autocomplete plugin that ships with Drupal. This means you don't have to download any 3rd party jQuery plugins or other Drupal modules.

In this video, we'll change the Tags widget on the Article content type to use Autocomplete Deluxe.

Installing Autocomplete Deluxe is easy, just download and enable. You do not have to download any 3rd party plugins or other Drupal modules. I recommend for now, that you use the 2.x dev version because beta2 is pretty old.

Configuring the module is fairly simple, to use the widget on a "Term reference" field just select "Autocomplete Deluxe" from the Widget drop-down list. In this section, I'll show you how to change the Tags widget to use "Autocomplete Deluxe".

Go to Structure, "Content types" and click on "manage fields". Click on the edit link within the Tags row. Click on the Widget type tab and select "Autocomplete Deluxe" from the Widget type drop-down list and click on Continue.

Now if we create a test article, we should see a new Tags widget. Go to Content, "Add content" and Article. Add a title and enter in a few tags. As you can see, we can create new tags and reuse existing ones.

If you don't want editors to be able to create new tags, then look at Chosen. Chosen is a JavaScript library that offers similar autocomplete functionality. And of course there is a module that integrates it with Drupal.

Save the article and you're done.