ASP.MVC - Multiple models in one view using default view engine - how to?

Question

I'm just getting into ASP.NET MVC, and am not sure how to solve the following issue which has come up in an excercise in a text book:

I have a View as below that is currently bound to a model "ShippingDetails". The View / Controller uses model binding to map the form fields that currently exist back to the ShippingDetails model.

I want to be able to use a second model here for credit card data, but am not sure how to start off. Do I need to create a container object and use that as the model?

I presume this would break the model binding that exists, as the form data won't map directly on to a property of the model?

I've found a post (http://stackoverflow.com/questions/4764011/multiple-models-in-a-view) that addresses the same issue in a different View engine, but I'd prefer to learn using the default view first off.

I've also seen examples using view data, but this doesn't appear that elegant.

How do I go about what I am trying to achieve here?

<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<SportsStore.DomainModel.Entities.ShippingDetails>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    SportsStore: Check Out
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

    <h2>Check out now</h2>

    Please enter your details, and we'll ship your goods right away!

    <%= Html.ValidationSummary() %>

    <%
        using (Html.BeginForm()) { %>

        <h3>Ship to</h3>

        <div>Name: <%= Html.TextBox("Name") %></div>

        <h3>Address</h3>

        <div>Line 1: <%= Html.TextBox("Line1") %></div>
        <div>Line 2: <%= Html.TextBox("Line2") %></div>
        <div>Line 3: <%= Html.TextBox("Line3") %></div>
        <div>City: <%= Html.TextBox("City") %></div>
        <div>State: <%= Html.TextBox("State") %></div>
        <div>Zip: <%= Html.TextBox("Zip") %></div>
        <div>Country: <%= Html.TextBox("Country") %></div>

        <h3>Options</h3>

        <%= Html.CheckBox("GiftWrap") %> Gift wrap these items

        <p align="center"><input type="submit" value="Complete Order" /></p>

    <%
        }
    %>

</asp:Content>

The solutions presented in this link should work whether you are using Razor or .aspx: http://stackoverflow.com/questions/4764011/multiple-models-in-a-view/4765113#4765113. You will just need to modify the view syntax a little bit. But the principles are exactly the same. — devuxer, May 17 '11 at 22:31

score 2 · Answer 1 · answered May 18 '11 at 05:07

I find that creating the wrapper class is the best way to go about things. Its clean and simple and, it is still quite easy to validate both individual classes. In the case of a validation failure, to ModelStateDictionary is shared between both of the children classes and you only need one validation summary.

score 2 · Accepted Answer · answered May 18 '11 at 05:32

You basically have two options. You may only supply a single "Model" object to the view engine, so you can create a model class which has all the properties you wish to capture within your form or has two child objects representing your shipping details and credit card info. You can also pass the objects through ViewData/ViewBag from your controller to the view.

ASP.MVC - Multiple models in one view using default view engine - how to?

2 Answers2