Question

我有一个视图，可以从中启动用于输入数据的模态弹出窗口：

<span class="AddLink ButtonLink">New Album</span>

<div id="AlbumDialog" title="" class="Hidden"></div>

<script type="text/javascript">
    $(function () {
        $("#AlbumDialog").dialog({
            autoOpen: false, width: 600, height: 400, modal: true,
            buttons: {
                "Save": function () {

                        //MAYBE DO VALIDATION HERE??? HOW TO CALL CONTROLLER?

                        $.post("/Music/CreateAlbum",
                                $("#_AlbumDialog").serialize(),
                                function (data) {   //OnSuccess
                                   $("#AlbumDialog").dialog("close");
                        });
                },
                Cancel: function () {
                    $(this).dialog("close"); 
                },
            }
        });

        $(".AddLink").click(function () {
            $("#AlbumDialog").html("")
                .dialog("option", "title", "Add Album")
                .load("/Music/CreateAlbum", function () { $("#AlbumDialog").dialog("open"); });
        });
    });
</script>

我的强类型部分视图由弹出窗口加载：

@model Models.ViewAlbum

<h2>Add Album</h2>

@using (Html.BeginForm("CreateAlbum", "Music", FormMethod.Post, new { id = "_AlbumDialog" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Fields</legend>

        <div class="editor-label">
            @Html.LabelFor(model => model.Artist,"Artist Name")
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Artist)
            @Html.ValidationMessageFor(model => model.Artist)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Title, "Album Title")
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Title)
            @Html.ValidationMessageFor(model => model.Title)
        </div>
    </fieldset>
}

我面临的挑战是我以前从未使用过“popup”，我希望能够像我以前一样使用我的控制器进行验证。所以我的控制器从弹出窗口提交了这个方法：

    [HttpPost]
    public ActionResult CreateAlbum(ViewAlbum album)
    {
            if (AlbumRepository.Exists(album)== false)
            {
                if (ModelState.IsValid)
                {
                    AlbumRepository.Save(album);

                    return RedirectToAction("ViewAlbums");
                }
                return PartialView("_AlbumDialog");   //HOW TO RETURN TO POPUP?
            }

            ModelState.AddModelError("Artist", "An identical album allready exist.");
            ModelState.AddModelError("Title", "An identical album allready exist.");

            return PartialView("_AlbumDialog");   //HOW TO RETURN TO POPUP?
    }

到目前为止一直很好，但这并没有给弹出窗口返回状态！：/

问题：

如何让弹出窗口显示错误（不先关闭），这样可以保存控制器保存输入的详细信息（就像通过验证的普通视图一样）？

有没有一种简单的方法可以在不使用编写大量jquery的情况下执行此操作，因为我更喜欢编写可测试的C＃（我不是jquery grand master :)。

注意： 我已经在网上阅读了很多关于如何做到这一点的内容，但这种方法是我能找到的最顺畅的方法。我仍然认为这是我必须写的很多jquery，但经过几个小时的冲浪后，我不得不开始，如果我不想死于挫折:)。

希望有人在大型网络空间可以给我一些指示：）。

亲切的问候。

Answer 1

我昨晚做了你想做的事。见this question。我有一个局部视图，呈现给模态对话框。当它在客户端有效时（mvc3验证）然后我在服务器端验证。如果可以，我刷新页面。如果有错误，我会以模态显示视图。

ASp .Net MVC 3.0，Razor - 从弹出窗体验证输入

1 个答案: