jquery - MVC 4 中使用 jQuery 表单提交的部分 View 和模型

Question

我正在开发一个基于 MVC 4 的 Web 应用程序，并且我正在尝试使用 HTML 表单进行一些工作。我在 View 模型中有几个单独的模型，如下所示:

public class NewAccountViewModel
{
    UserModel User { get; set; }
    AccountModel Account { get; set; }
    TicketModel Ticket { get; set; }
}

然后我用它作为我的观点的模型。该 View 还包含每个模型的部分 View 。每个部分 View 也使用 View 模型作为它们的模型，我从主视图传递 View 模型实例，如下所示:

@Html.Partial("~/Views/Account/_User.cshtml", Model)

然后在部分 View 中，我添加字段，例如:

@Html.TextBoxFor(m => m.User.Name)

在我的 POST 处理程序中，我接受 View 模型实例作为参数，并且可以使用从表单提交的数据。该表单使用 jQuery.post 提交，并以 $('#nameofmyform').serialize() 作为数据。

这种方法的效果正如预期的那样。然而，部分 View 和 View 模型之间的耦合过于紧密。如果我想在具有不同 View 模型的不同 Controller 中使用用户模型，这是不可能的，因为部分 View 使用此特定 View 模型。

所以，我尝试的是:

@Html.Partial("~/Views/Account/_User.cshtml", Model.User)

然后，使用实际模型作为部分 View 的模型，绑定(bind)字段:

@Html.TextBoxFor(m => m.Name)

这是单向工作的，因为所有字段都使用 View 模型及其包含的模型中的数据正确填充。但是，在 POST 时， View 模型未正确序列化回来。通过检查从表单发回的数据，我发现在第一种方法中，所有内容都绑定(bind)到 View 模型，它使用如下数据序列化表单:

{ "User.Name" : "Blahblah" ...

而使用第二种方法时，它只是通过模型序列化表单:

{ "Name" : "Blahblah" ...

这样， View 模型的模型属性在 POST 处理程序中都是空值。

所以，我真正想知道的是:是否可以以某种方式在 View 模型中添加属性名称，以便它在我的 View 模型中正确序列化？我需要在 JavaScript 中/通过 jQuery 执行此操作，还是可以在我的 .NET 代码中执行此操作？

Answer 1

使用编辑器模板而不是部分模板:

@Html.EditorFor(x => x.User, "_User")

然后定义~/Views/Shared/EditorTemplates/_User.cshtml:

@model User
...
@Html.TextBoxFor(m => m.Name)

现在您的输入字段将被正确命名，因为与部分相反，编辑器模板尊重导航上下文。