ASP.net MVC 5 部分视图 Ajax POST 不只更新部分

Question

我有一个不只更新部分视图的部分视图，它会重定向到整个页面的操作。

在部分视图 _registerAccount.cshtml 中，它包含一个注册的发布请求，该请求是通过 Ajax 在名为 _registerAccount 的视图中发出的，如下所示：

@model LoginDemo.Models.LdapAccountModel

@using (Ajax.BeginForm("RegisterLdapAccount", "Account", new AjaxOptions
{
    HttpMethod = "Post",
    InsertionMode = InsertionMode.Replace
}))
{
    @Html.ValidationSummary()
    @Html.LabelFor(x => Model.Email) @Html.TextBoxFor(x => Model.Email, new { id = "reg-ytu-email" })
    <br />
    @Html.LabelFor(x => Model.Password) @Html.PasswordFor(x => Model.Password, new { id = "reg-pw" })
    <input type="submit" value="Register" class="btn" />
}

在父页面，Register.cshtml 我有：

@model LoginDemo.Models.RegisterModel
...            
<div class="panel hide register-type register-ytu">
  @Html.Partial("_registerAccount")
</div>

在 Account Controller 中，ajax 请求转到 RegisterAccount 操作：

    [HttpPost]
    public async Task<ActionResult> RegisterLdapAccount(LdapAccountModel model)
    {
        if (model.exists()) // pseudo code
        {
            return Json(new {foo: "bar"}); // return address to redirect to
        }
        else
        {
            ModelState.AddModelError("", "You must have a valid account.");

            return PartialView(model); // return error
        }
    }

我遇到的问题是，无论返回什么都会清除整个页面，而不是只更新父页面中的部分内容。也就是说，如果成功返回JSON只返回JSON，如果失败返回部分视图只返回部分。

n.b.我的 web.config 中有 <add key="UnobtrusiveJavaScriptEnabled" value="true" />。

Answer 1

修改如下代码：

@using (Ajax.BeginForm("RegisterLdapAccount", "Account", new AjaxOptions
{
    HttpMethod = "Post",
    InsertionMode = InsertionMode.Replace,
UpdateTargetId = "updatearea",

修改div添加id：

<div id="updatearea" class="panel hide register-type register-ytu">
  @Html.Partial("_registerAccount")
</div>

如果您还没有的话，请确保您在页面上使用了不引人注目的 ajax 作为脚本。

<script type="text/javascript" src="@Url.Content("/scripts/jquery.unobtrusive-ajax.min.js")"></script>

要添加此脚本，它必须位于项目的脚本文件夹中。

修改控制器，以便您加载正确的局部视图，如果您没有说明局部视图的名称，则加载的局部视图将与动作名称匹配，如果没有局部视图与该动作不会加载局部视图。所以明确说明你想加载哪个局部视图，如下所示：

return PartialView("_RegisterAccount", model)