var input = document.querySelector('input')

var tagify = new Tagify(input, {

  dropdown: {

    enabled: 0,

    includeSelectedTags: true  ,

  mapValueTo: data => {

    if (data.value == false) return ''; //do not know why but we receive an empty array at the end - skip it

​

    return data.name_long !== undefined ? data.name_long : data.name; //return name_long if present, short if not

  }

  },

   whitelist: [{

            "value": "1",

            "name": "One"

        },

        {

            "value": "2",

            "name": "Two"

        },

        {

            "value": "3",

            "name": "Three"

        }],

  transformTag: tagData => {

    if (tagify === undefined) return;

​

    tagify.value.forEach(tag => {

      console.log(tag.value);

      console.log(tagData.value);

      if (tag.value == tagData.value) {

        tagData.value = '';

        return;

      }

    });

  }

})

​

tagify.on('change', console.log)

​

tagify.addTags(["One", "Two"])