Best practice / design for multipage form in .NET MVC3

Question

I am working on a web application in which a user fills out a multi-step form that spans several pages. The form has a navigation tab at the top (these links do not represent the current page) and the next button at the bottom (which does represent). I am considering several processing and form validation strategies:

• one action method and view on the form page. When you click next, it will submit the form to the action method for the next page. If there are verification errors, you are redirected to the previous page:

  • URLs are descriptive and can be copied in brackets
  • Error Forwarding Only
  • Since the redirect has no form data, we lose the view context, which makes it difficult to display certain error messages.
  • The same validation logic works to redirect the user if they try to visit a step in a thread that is not yet ready for work

• one action method and view on the form page. When you click next, it will submit the form to the current page. If there are validation errors, the same view is returned. Otherwise, we redirect the action of the following page:

  • URLs are descriptive and can be copied in brackets
  • Redirects are very common (not sure if this is bad)
  • When displaying validation errors, we are in the same request as the form submission, so we have full access to invalid input
  • It’s necessary to convey additional context if we want, for example, to add the “Previous” button, which also sends

• one action method for ALL pages. The URL contains additional context about the step being submitted (for example, MyController/MyAction/{step} ). The controller message selects which browse page to return based on the check and the current step.

  • URLs are not descriptive (for example, if I submit step 1 to go to step 2, then the URL that the user sees will be the same regardless of whether page 1 returns (invalid) or page
  • No redirect
  • When displaying validation errors, we are in the same request as the form submission, so we have full access to invalid input

• Another method that I have not listed here

I tried to list what I see as some of the pros and cons of each method, but I would be interested to know:

• What are the other pros and cons of these methods? Am I right? Could some of the minuses that I have listed create?
• Is there a standard approach to this problem that I should use? If so, why is this a standard approach?

Answer 1

I highly recommend option 2 with a slight modification. You might also want to think about creating one view model for each action / view. If you have one model that covers all pages, the check will be performed in all properties, which means that even if the user can edit part of the model only on each screen, they can receive validation warnings for properties that they do not see. We did this recently in a project, and it worked beautifully. You have to do some data manipulation in the back-end to put everything together, but it was worth it in the end.

As you said, your URLs will be interchangeable, which means that users can copy / paste, and more importantly, they can add the page as a favorite in their browser, which allows them to return to the same place very easily In my opinion, this makes option 3 obsolete.

You will also benefit from all of your navigation logic happening in one place. You will need to save the state of the "wizard" on the client (on which page you are currently on) so that your controller knows what to do when sending. You will want to analyze the state of the wizard and decide on where the user should go. If you go with option 1, you won’t know where you came from, and server verification errors will be difficult to display to the client. This is a great example of a POST - REDIRECT - GET template. Each page will have 2 actions, GET, which accepts simple identifiers, and POST, which accepts more complex models. Send the server, find out where to go next, redirect to GET.

Finally, review the previous button by simply linking it directly to the previous step, instead of submitting the form. Otherwise, the user could potentially be stuck on an invalid step. It happened to us and again, it worked very nicely.

Hope this was helpful. Good luck