ASP.NET MVC4动态表单生成

Question

我是ASP.NET MVC的新手，需要一些帮助。我需要创建一个动态表单。比如说我有一个叫做“Person”的模型。Person有名字和姓氏。在这个表单中，我想让用户输入这个人的名字和姓氏。我知道如何实现这一点，但我不知道如何让用户添加多个人并使其成为单个表单提交。

在页面(视图)的初始加载时，默认情况下会显示两个空文本框(用于名字和姓氏)。我还将添加一个按钮，允许用户添加另一行到表单中，并显示第二个人的相同2个文本框。现在如果用户提交它，它将有2个文本框的名字和2个姓氏的文本框。

我不知道是否有一种方法可以在没有回传的情况下实现这一点。或者我的唯一选择是回传吗？

编辑：忘记提到我正在使用Razor引擎。

谢谢

- iheartcsharp

---

请查看Partial Views，您需要创建一个IEnumerable <Person>模型和一个Partial View，允许用户添加另一个人。有很多关于代码示例的信息可以在SO和Google上帮助您。 - Nicholas King

@NicholasKing，如果您有相关链接，我将不胜感激。与此同时，我会进行一些搜索... - iheartcsharp

看一下这个。我觉得它非常有用 http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/ - Nicholas King

@user78739 你好！这里提醒一下，我们希望你能够对回答给予反馈（以便作者进行改进），在回答有价值时点赞，并标记真正帮助到你的答案为正确答案。 - Andre Calil

Answer 1

不需要多次POST。你希望你的表单向你的操作发送一个Person数组。该操作将类似于：

[HttpPost]
public ActionResult AddPeople(Person[] people){ ... }

为了实现这个目标，您必须在视图中枚举输入字段。它们必须有索引，从0开始递增，例如：

@using(Html.BeginForm("AddPeople","TheController", FormMethod.Post))
{
  <input type="text" name="people[0].FirstName" />
  <input type="text" name="people[0].LastName" />
  ...
  <input type="text" name="people[1].FirstName" />
  <input type="text" name="people[1].LastName" />
  ...
  <input type="text" name="people[n].FirstName" />
  <input type="text" name="people[n].LastName" />
}

您必须使用JavaScript添加新字段，通过简单的DOM操作来完成。只需记住保持索引有序即可。

- Andre Calil

Answer 2

在他的博客中，Steven Sanderson有一篇关于这个问题的非常好的文章...它不依赖于每个人的数字索引，以避免在中间删除一个“空洞”。

在这里查看文章：http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/ 然后，您需要验证：http://blog.stevensanderson.com/2010/01/28/validating-a-variable-length-list-aspnet-mvc-2-style/ 我在MVC 3和4中使用这段代码...它像魔术一样运行。

- Romias

Answer 3

Phil Haack 写了一篇文章，内容基本涵盖了你想要实现的功能。如果要使其动态（即可以将1个或多个人添加到列表中），则需要通过将点击事件附加到添加按钮来复制新的一行输入字段来进行JavaScript操作。我建议首先阅读该文章，以便了解如何构造输入字段，以便在提交时填充列表。

- Justin Chmura