jquery - MVC中的Bootstrap模态对话框返回消息

我需要一些帮助，以便从mvc的Partial View中的引导模式对话框中返回成功或错误消息。

当单击_LayoutAdmin视图中的链接时，部分视图Impersonation.cshtml将加载到模式对话框中。

输入并单击提交按钮后，弹出框将关闭并发布到控制器中。如果用户输入数据不存在，如何在模式对话框中显示错误消息？

任何指导都非常感谢！

屏幕截图：



_LayoutAdmin.cshtml：

<a href="@Url.Action("Impersonation", "UserRoles")" class="modal-link">
  Impersonation &nbsp;
   <span class="glyphicon glyphicon-user" aria-hidden="true"></span>
</a>

<div id="modal-container" class="modal fade" tabindex="-1" role="dialog">
</div>

<script>

 $(function () {

                $('body').on('click', '.modal-link', function (e) {
                    e.preventDefault();
                    $(this).attr('data-target', '#modal-container');
                    $(this).attr('data-toggle', 'modal');
                });
                // Attach listener to .modal-close-btn's so that when the button is pressed the modal dialog disappears
                $('body').on('click', '.modal-close-btn', function () {
                    $('#modal-container').modal('hide');
                });
                //clear modal cache, so that new content can be loaded
                $('#modal-container').on('hidden.bs.modal', function () {
                    $(this).removeData('bs.modal');
                });
                $('#CancelModal').on('click', function () {
                    return false;
                });
        });

    </script>

（部分视图）Impersonation.csthml：

@model FAB_Portal.Models.FAB_View
@using (Html.BeginForm())
{
    <script type="text/javascript">

        $("a#impersonate").click(function () {
            var username = $('#UserName').val();
            $.ajax({
                type: "POST",
                url: "@Url.Action("Impersonation", "UserRoles")",
                data: { UserName: username },
                success: function (result) {
                    if (result.success) {
                        $('#modal-dialog').modal('hide');

                    } else {
                        $('#modal-body').html(result);
                    }
                }
            });
        });

    </script>

<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" })
                <text class="text-danger">@ViewBag.Error</text>
            </div>
        </div>

        <div class="modal-footer">
            @using (Html.BeginForm("Impersonation", "UserRoles", FormMethod.Post))
            {
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <a class="btn btn-danger btn-ok" id="impersonate" >Submit</a>
            }
        </div>
    </div>
</div>
}

UserRoles.Controller：

public ActionResult Impersonation()
{
    return PartialView("Impersonation");
}

[HttpPost]
public ActionResult Impersonation(FAB_View model)
{
    if (ModelState.IsValid)
    {
        UserRoleHelper userrolehelper = new UserRoleHelper();
        bool validuser = userrolehelper.CheckValidUser(model.UserName);
        if (validuser == false)
        {
            ViewBag.Error = "Don't have such user!";
            return PartialView("Impersonation");
        }
        userrolehelper.StartImpersonate(model.UserName);
    }
    return PartialView("Impersonation");
}

最佳答案

使用以下内容自行修复：



LayoutAdmin视图：

<script>
 $(function () {

        $.ajaxSetup({ cache: false });

        $("#impersonate").on("click", function (e) {

            // hide dropdown if any
            $(e.target).closest('.btn-group').children('.dropdown-toggle').dropdown('toggle');

            $('#myModalContent').load(this.href, function () {
                $('#myModal').modal({
                    /*backdrop: 'static',*/
                    keyboard: true
                }, 'show');
                bindForm(this);
            });
            return false;
        });
    });

    function bindForm(dialog) {

        $('form', dialog).submit(function () {
            $.ajax({
                url: this.action,
                type: this.method,

                data: $(this).serialize(),
                success: function (result) {
                    if (result.success) {
                        $('#myModal').modal('hide');
                        //Refresh
                        location.reload();
                    } else {
                        $('#myModalContent').html(result);
                        bindForm();
                    }
                }
            });
            return false;
        });
    }

</script>

Impersonation.cshtml：

[HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Impersonation(FAB_View model)
        {
            if (ModelState.IsValid)
            {
                UserRoleHelper userrolehelper = new UserRoleHelper();
                var loggedonuser = userrolehelper.GetLoggedOnUser();
                var currentuser = userrolehelper.GetCurrentUser();

                bool validuser = userrolehelper.CheckValidUser(model.UserName);

                if (validuser == false)
                {
                    ViewBag.Error = "* Don't have such user!";
                    return PartialView("Impersonation", model);
                    //return Json(new { success = false });
                }
                else
                {
                    //userrolehelper.StartImpersonate(model.UserName);
                    return Json(new { success = true });
                }
            }

            return PartialView("Impersonation", model);

        }

关于jquery - MVC中的Bootstrap模态对话框返回消息，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36329167/