Modal上的Select2下拉列表非常奇怪

时间:2018-03-08 06:03:16

标签: jquery jquery-select2

我正在使用模态中的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>

0 个答案:

没有答案