Tagify

Basic

Basic Tagify input using Tagify(input) with default settings.

new Tagify(document.querySelector('input[name=basic]'));

With whitelist

Tagify with predefined values using a whitelist.

new Tagify(document.querySelector('input[name=whitelist]'), {
  whitelist: ['JavaScript', 'PHP', 'Laravel', 'Node.js', 'MySQL'],
  dropdown: {
    enabled: 1
  }
});

Enforce whitelist

Only allows tags defined in the whitelist using enforceWhitelist: true .

new Tagify(document.querySelector('input[name=enforce]'), {
  whitelist: ['Admin', 'Editor', 'User'],
  enforceWhitelist: true,
  dropdown: {
    enabled: 0
  }
});

Readonly

Read-only Tagify input using readonly: true .

new Tagify(document.querySelector('input[name=readonly]'), {
  readonly: true
});

Max tags

Limits the number of tags using maxTags: 3 .

new Tagify(document.querySelector('input[name=max]'), {
  maxTags: 3
});