.NET MVC3中多页表单的最佳实践/设计

Question

我正在开发一个Web应用程序,该应用程序涉及用户填写跨越多个页面的多步骤表单.表单顶部有标签导航(这些链接不提交当前页面)和底部的下一个按钮(确实提交).我正在考虑处理表单提交/验证的几种策略:

1. 每个表单页面一个操作方法和视图.当您点击下一步时,它会将表单提交给下一页的操作方法.如果存在验证错误,您将被重定向回上一页:

   • URL是描述性的,可以复制粘贴
   • 仅在错误情况下重定向
   • 由于重定向没有表单数据,因此我们丢失了有关提交的上下文,这使得很难显示某些错误消息
   • 如果用户尝试访问尚未准备好的流程中的步骤,则相同的验证逻辑可用于重定向用户

2. 每个表单页面一个操作方法和视图.当您点击下一步时,它会将表单提交给当前页面操作.如果存在验证错误,则返回相同的视图.否则,我们会重定向到下一页操作:

   • URL是描述性的,可以复制粘贴
   • 重定向很常见(不确定这是不是很糟糕)
   • 显示验证错误时,我们与表单提交的请求相同,因此我们可以完全访问无效输入
   • 如果我们想要能够添加一个也提交的"上一个"按钮,则必须传递其他上下文

3. 所有页面的一种操作方法.URL包含有关正在提交的步骤的其他上下文(例如MyController/MyAction/{step}).控制器消息根据验证和当前步骤选择要返回的视图页面.

   • URL不具有描述性(例如,如果我提交步骤1转到步骤2,则无论是否返回页面1(无效)或第2页,用户看到的URL都是相同的
   • 没有重定向
   • 显示验证错误时,我们与表单提交的请求相同,因此我们可以完全访问无效输入

4. 我没有在这里列出的另一种方法

我试图列举我所看到的每种方法的一些优点和缺点,但我很想知道:

• 这些方法的其他优点和缺点是什么？我的是正确的吗？我列出的一些缺点可以设计一下吗？
• 我应该使用这个问题的标准方法吗？如果是这样,为什么它是标准方法？

Answer 1

我强烈推荐选项 2，稍加修改即可。您可能还想考虑为每个操作/视图创建一个视图模型。如果您有一个跨越所有页面的模型，则验证将在所有属性上进行，这意味着即使用户只能在每个屏幕上编辑模型的一部分，他们也可能会收到他们看不到的属性的验证警告。我们最近在一个项目中做到了这一点，并且效果非常好。您必须在后端进行一些数据操作才能将所有内容重新组合在一起，但最终这是值得的。

正如您所说，您的 URL 将是可深度链接的，这意味着用户可以复制/粘贴，更重要的是，他们可以将页面添加为浏览器中的收藏夹，从而使他们可以轻松返回同一位置。在我看来，这使得选项 3 变得过时。

您还将受益于所有导航逻辑都发生在一个地方这一事实。您必须在客户端（您当前所在的页面）上存储“向导”的状态，以便您的控制器知道提交时要做什么。您需要分析向导的状态并决定用户下一步需要去哪里。如果您选择选项 1，您将不知道您“来自哪里”，并且服务器验证错误将很难向客户端显示。这是 POST - REDIRECT - GET 模式的一个漂亮示例。每个页面都有 2 个操作，一个采用简单 id 的 GET，以及一个采用更复杂模型的 POST。发布服务器，弄清楚下一步该去哪里，重定向到 GET。

最后，考虑您的上一个按钮只是直接链接到上一步，而不是提交表单。否则，用户可能会陷入无效步骤。这种情况再次发生在我们身上，效果非常好。

希望这有帮助。祝你好运！