ASP.Net MVC4 bind a “create view” to a model that contains List

Question

Hello out there in internet land, I have an interesting conundrum for you:

Is it possible to bind a view for creating an object, if that object contains a list of ot

Answer 1

I recently found myself needing to accomplish the same task and, like you, not wanting to add a bunch of javascript. I'm using MVC4 and, as best I can tell, there doesn't appear to be an out-of-the-box way to bind enumerable properties of a model to a view. :(

However, as you demonstrated in your question, it is possible to retrieve enumerable properties from the model in a view. The trick is just getting the updates back to the controller. Going off of your example models, your view could look like this (you don't need to make a partial):

@model MVCComplexObjects.Models.ComplexObject

<p>
@Html.ActionLink("Create New", "Create")
</p>

@using (Html.BeginForm("SaveNew", "Home", FormMethod.Post))
{
    <table>

        <tr>
            <th>
                @Html.DisplayNameFor(model => model.contents[0].name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.contents[0].data)
            </th>
            <th></th>
        </tr>

        @for (int i = 0; i < Model.contents.Count; i++)
        {
            <tr>
                <td>
                    @Html.TextBox("updatedContents["+i+"].name", Model.contents[i].name)
                </td>
                <td>
                    @Html.TextBox("updatedContents["+i+"].data", Model.contents[i].data)
                </td>
                <td>
                    @* Got rid of the edit and detail links here because this form can now act as both *@
                    @Html.ActionLink("Delete", "Delete", new { /* id=item.PrimaryKey */ })
                </td>
            </tr> 
        }

    </table>

    <input type="submit" value="Save" />
}

And your controller action would look like this:

[HttpPost]
public ActionResult SaveNew(ICollection<ContainedObject> updatedContents)
{
    foreach (var co in updatedContents)
    {
        //Update the contained object...
    }

    return RedirectToAction("Index");
}

Basically, we are defining a new collection object in the view for MVC to pass to your action method upon form submission. The new object ("updatedContents" in this example) is basically the same as the list property ("contents", in this example) that was defined and populated in the ComplexObject model.

This is a bit more work, but does accomplish the goal of not needing any javascript for the post back. Everything can be done with standard MVC.

Answer 2

Read this article:

http://haacked.com/archive/2008/10/23/model-binding-to-a-list.aspx

Then read this one:

http://blog.stevensanderson.com/2010/01/28/editing-a-variable-length-list-aspnet-mvc-2-style/

The articles are for MVC2, but will work in 3 and 4.