부트 스트랩 태그 입력이 lazyload와 함께 작동하지 않습니다.

Question

bootstrap-tagsinput을 적용하려는 입력 필드가있는 페이지에서 여러 이미지 중 하나를 클릭하여 시작되는 모달이 있습니다.

$(document).on("click","a.lazy",function(){   
     $("#form").find(".title").attr('value',$(this).find(".title").val()); 
     $("#form").find(".title").attr('data-role','tagsinput'); 
     $("#form").modal("show"); 
}); 

내가 가치와 데이터 역할을 할당하고 다음과 같은 입력 필드에 lazyload와 속성 : 나는 속성이 존재하는 것을 볼 수 있습니다 모달를 시작하지만, 일단

<div class="input-group"> 
    <span class="input-group-addon">Tags</span> 
    <input type="text" class="form-control title" placeholder="Enter Tags for the Image" name="title"> 
</div> 

태그가 없습니다 적용된. 내가 도대체 ​​뭘 잘못하고있는 겁니까?

<input type="text" class="form-control title" placeholder="Enter Tags for the Image" name="title" value="yellow" data-role="tagsinput"> 

Answer 1

그냥 추가 data-role 입력 필드에 충분하지 않다 - 당신이 그것을 추가되기 때문에 동적으로과 같이 부트 스트랩-태그 입력을 초기화해야합니다,

$(document).on("click","a.lazy",function(){   
     $("#form").find(".title").attr('value',$(this).find(".title").val()); 
     $("#form").find(".title").attr('data-role','tagsinput'); 

     // Destroy all previous bootstrap tags inputs (optional) 
     $('input[data-role="tagsinput"]').tagsinput('destroy'); 
     // Create the bootstrap tag input UI 
     $('input[data-role="tagsinput"]').tagsinput('items'); 

     $("#form").modal("show"); 
});