Question

I’m using Asp.Net MVC 2 and I have a situation where I’m building a Create/Edit form to a class that some of it’s properties are collections. The user can add N items to each collection. My ViewModel is like this:

public class Person  
{  
   public string Name {get; set;}  
   public DateTime BirthDate {get; set;}     
   public IList<Address> Addresses {get; set;}
}

public class Address
{
   public string StreetName {get; set}  
   public int Number {get; set;}  
   public string Neighborhood {get; set;}
}  

It’s a requirement that the user hits the submit button just once, that is, just one form. So I tried to use the solution Steven Sanderson shows here http://blog.stevensanderson.com/2010/07/12/editing-a-variable-length-list-knockout-style/ , but it requires that my view inherits from a IEnumerable. In my scenario I have one person that has many addresses and many telephones, and etc… and not a collection o Person.

I can add the form elements using JQuery, but I don’t know how to do the data binding on the controller.

Can anyone help me with this?

Thanks a lot!

Answer 1

Phill Haak have a great post about such scenario:

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

There are various examples in the post.

<% for (int i = 0; i < 3; i++) { %>

  <%: Html.TextBoxFor(m => m.Addresses[i].StreetName) %>
  <%: Html.TextBoxFor(m => m.Addresses[i].Number) %>
  <%: Html.TextBoxFor(m => m.Addresses[i].Neighborhood) %> 

<% } %>

For adding values via javascript you just need to keep naming conventions:

<input type="text" name="Addresses[0].StreetName" />
<input type="text" name="Addresses[0].Number" />
<input type="text" name="Addresses[0].Neighborhood" />

<input type="text" name="Addresses[1].StreetName" />
<input type="text" name="Addresses[1].Number" />
<input type="text" name="Addresses[1].Neighborhood" />

P.S. not sure in the names. Check how it will be generated by the first sample.