Bootstrap Теги Входные события не срабатывают при использовании с элементом, созданным с помощью вызова AJAX

Question

У меня есть страница с формой, которая создается с помощью вызова AJAX и содержит Bootstrap Tags Input element. Следующий код, который пытается воспользоваться стандартными тегами ввода событий, не имеет никакого эффекта:

Javascript:

<script> 
    $(document).on('itemAdded itemRemoved', '.bootstrap-tagsinput input', function(e) { 
     alert('triggered'); 
     // call some function 
    }); 

    // after the form is generated via the AJAX call, the tags input is 'refreshed' 
    ... 
     $('.input_tags').tagsinput('refresh'); 
    ... 
</script> 

HTML (это стандарт HTML, который генерируется, когда Метки ввода плагин применяется; «тега ...» элементы добавляются/удалить в соответствии с пользователем добавление/удаление тэгов из поля ввода):

<div class="bootstrap-tagsinput"> 
    <span class="tag label label-info"> 
    ... 
    <span class="tag label label-info"> 
    <input type="text" size="4"> 
</div> 

Любые идеи, чтобы что здесь может быть неправильным, и как это исправить?

Answer 1

Как только попробуйте это, он должен работать.

Добавить идентификатор для элемента ввода.

<div class="bootstrap-tagsinput"> 
    <span class="tag label label-info"> 
    ... 
    <span class="tag label label-info"> 
    <input type="text" id="idInput" size="4"> 
</div> 

Вы событие должно быть, как это

$("#idInput").on('itemAdded', function(event) { 
    console.log('item added : '+event.item); 
}); 
$("#idInput").on('itemRemoved', function(event) { 
    console.log('item removed : '+event.item); 
}); 

Answer 2

Вот решение, что я нашел:

Ниже видимый вход в «самозагрузке-tagsinput» сНа элемента, скрытый вход существует поле, которое имеет атрибуты поля ввода, которое было создано на стороне сервера, и к которому применяется .tagsinput(). События должны быть связаны с этим полем, а не с видимым входом, находящимся в div-bootstrap-tagsinput.