在modal中打开bootstrap select2

Question

我有打开MODAL的按钮。这个模式的内容来自LINK(另一个文件-form_model.php(，它是一个动态的content/form.

在模态中，我有SELECT2插件不起作用，我不明白为什么。

index.php

$(document).on("click", ".manage-modal", function(e){

act = $(this).attr("data-act");
ID = $(this).attr("data-ID");


var link = "form_modal.php?act="+act+"&ID=" + ID;

$('.modal-body').load(link,function(){
$('#manage-modal').modal({show:true});
});

});

<link href="plugins/custom-select/custom-select.css" rel="stylesheet" type="text/css" />
<script src="plugins/custom-select/custom-select.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('.select2').select2({dropdownParent: $('#manage-modal')  });
});
</script>


<a href='#' class='manage-modal' data-toggle="modal" data-target="#manage-modal" data-act="new">OPEN MODAL BUTTON</a>
<div id="manage-modal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">

<div class="modal-body">
</div>

</div>
</div>
</div> 

模式内容(form_model.php(:

<form>
<select name="contries" class="form-control select2">
<option value='FR'>FRANCE</option>
<option value='SP'>SPAIN</option>
<option value='USA'>USA</option>
</select>
</form>

Answer 1

您需要再次初始化form_modal.php中的select2。据我所知，原因是动态页面没有加载并捕获select2脚本，因为加载index.php时它已经在运行，而加载页面和脚本时form_modal.php不在。

<form>
<select name="contries" class="form-control select2 select2-modal">
<option value='FR'>FRANCE</option>
<option value='SP'>SPAIN</option>
<option value='USA'>USA</option>
</select>
</form>
<script>
$(document).ready(function() {
$('.select2-modal').select2();
});
</script>