Bootstrap 4 теги ввода - добавлять теги только из предопределенного списка

Question

Я использую Bootstrap 4 и Ввод тегов Bootstrap для выбора нескольких категорий.Я хочу выбрать несколько элементов только из предопределенных категорий, перечисленных в predefined_list

Прямо сейчас, всякий раз, когда пользователь вводит что-либо в поле ввода, работает автоматическое предложение (с использованием предопределенного списка) иПользователь может просмотреть предлагаемый соответствующий тег категории и добавить их.

Однако пользователь также может добавить новые / пользовательские теги произвольной категории, введя его вручную.Скажем, пользователь набрал «Apple» или «Банан».Список категорий также представлен с пользовательскими элементами.Я хочу, чтобы пользователю было запрещено добавлять новую / настраиваемую категорию и выбирать только из существующей автоматически предлагаемой категории.

<div class="col-lg-12">
    <span class="pf-title">Categories</span>              
    <div class="pf-field no-margin">
        <input id="category-input" name="category" type="text" data-role="tagsinput">
    </div>
</div>

<script type="text/javascript">
    var predefined_list = ["Linux", "Mac", "Windows"]
    $('#category-input').tagsInput({
    'autocomplete': {
    source: predefined_list
    },
    trimValue: true,
    });
</script>

Answer 1

Посмотрите список событий в примерах https://bootstrap -tagsinput.github.io / bootstrap-tagsinput / examples /

ES6:

$('#category-input').on('beforeItemAdd', (event) => {
  if(!predefined_list.includes(event.item)) {
     event.cancel = true;
  }
});

ES5:

$('#category-input').on('beforeItemAdd', function(event) {
  if(predefined_list.indexOf(event.item) === -1) {
     event.cancel = true;
  }
});

1. Запустить Eventlistener, который ловит событие «до добавления элемента»
2. Если предопределенный список не включает добавленный элемент, установите для отмены variable значение true, чтобы он не добавлялся
3. Существует с ES6.ES5 работает с indexOf (который возвращает -1, если совпадений нет)