模態彈出引導程序中的自動完成框

Question

我已經使用引導程序實現了一個模態彈出窗口，並在其中包含了 jquery 自動完成框。 但是，當我在文本框中鍵入內容時，建議文本將出現在模式彈出框的后面，而不是“內部”。 我做錯了什么嗎？ 請指教，非常感謝！

我的剃刀視圖 cshtml：

 <div class="modal fade" id="impersonation" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
            <div class="modal-dialog">
                <div class="modal-content">

                    <div class="modal-header">
                        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                        <h4 class="modal-title" id="myModalLabel"><span class="glyphicon glyphicon-user" aria-hidden="true"></span>&nbsp;Impersonation</h4>
                    </div>

                    <div class="modal-body">
                        <div class="form-horizontal">
                                @Html.Label("Impersonate", htmlAttributes: new { @class = "control-label col-md-4" })
                                @Html.TextBox("UserName", null, htmlAttributes: new { @class = "form-control" })                         
                        </div>
                    </div>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                        <a class="btn btn-danger btn-ok" id="impersonate" data-dismiss="modal">Start Impersonation</a>
                    </div>
                </div>
            </div>
        </div>

我的javascript：

$('#impersonation').on('show.bs.modal', function (e) {
    $(this).find('.btn-ok').attr('href', $(e.relatedTarget).data('href'));
    $(this).find('.btn-ok').attr('custom', $(e.relatedTarget).data('custom'));
});

$(document).ready(function () {
    $("#UserName").autocomplete({
        source: '@Url.Action("AutoCompleteUser","UserRoles")'
    });
})

Answer 1

通過修改找到解決方案如下：

$(document).ready(function () {
        $("#UserName").autocomplete({
            source: '@Url.Action("AutoCompleteUser","UserRoles")',
            appendTo: $('.modal-body')
        });
    })