我正在使用模态中的Select2
下拉列表。
之前我无法在输入下拉列表中搜索,因此我添加了以下行
dropdownParent: $("#modalId")
在初始化Select2
时添加上述行后,搜索已启动,但现在下拉列表的定位无法按预期工作。
因为在我的页面上有一个项目列表,并且我为每个项目添加了一个弹出的常用模态。对于前两个项目,模态中的Select2
下拉列表工作正常,但只要我向下滚动到其他项目并打开模态,下拉列表就会向下移动。
无法理解。
Select2
初始化代码
jQuery(".select3").select2({
width: '100%',
dropdownParent: $("#modal-id")
});
模态代码
<div class="modal fade bs-example-modal-sm" id="modal-id" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" style="display: none">
<div class="modal-dialog modal-sm">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
</div>
<div class="modal-body">
@Html.DropDownList("DropDown", new SelectList(ViewBag.Users, "Value", "Text", new { @id = "dropdown" }), "Please select", new { @class = "form-control select3 " })
</div>
<div class="modal-footer" style="border-top:0px;">
<input type="hidden" id="id">
<button type="button" class="btn btn-default waves-effect" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-danger waves-effect waves-light delete-confirm" disabled>Confirm</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div>