2017-12-26 13 views
0

각 div 안에 템플릿 리터럴을 통해 동적 div를 만드는 기능이 있습니다. select2 select 필터를 추가하고 싶지만 동적 div가 내 페이지에서 렌더링 될 때 select2가 초기화되지 않습니다. 아무도 이것을 고치는 방법을 압니까?Select2 동적 div에 적용되지 않습니다

자바 스크립트 :

function render_report_grid(data){ 
      var details = `<select class="filter_select2 pull-right" 
          id="filter_select2_${data.id}" multiple="multiple" name="select_project"> 
          </select>` 
} 

$('.filter_select2').select2({placeholder: "Select parent",}); 
+1

스 니펫 또는 JSFiddle을 추가 할 수 있습니까? –

+2

동적으로 생성 된 각 내용에 대해 select2를 다시 실행해야합니다. –

답변

0

당신이 좋아하는 기능 내부의 시작 부분을 추가해야합니다 : 아래의 예제 코드 조각입니다

function render_report_grid(data){ 
    var details = `<select class="filter_select2 pull-right" 
        id="filter_select2_${data.id}" multiple="multiple" name="select_project"> 
        </select>` 

    $('.filter_select2').select2("destroy").select2({placeholder: "Select parent"}); 
} 

그래서 당신은 새로운 선택 태그를 추가 할 때마다 그것을 select2 인스턴스로 초기화 할 것입니다. 당신이 필요하므로,

$('.filter_select2').select2({placeholder: "Select parent"}); 

JQuery와 선택기 아무것도 발견되지 않았습니다

+0

안녕하세요 @Zakaria, 불행히도이 코드는 코드를 추가 한 후 동적 div 만 렌더링 할 수 있습니다. –

0

나는 문제가 당신이 당신의 페이지에 추가하기 전에 당신이 선택 2를 만드는, 그래서 당신이하고있는 때이다라고 생각 html로 앞에 추가하십시오.

var details = '<select class="filter_select2 pull-right" id="filter_select2_${data.id}" multiple="multiple"name="select_project"></select>'; 
$('some_jquery_selector').append(details); 
$('.filter_select2').select2({placeholder: "Select parent"});