模态弹出引导程序中的自动完成框

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')
        });
    })