title: How can I add rows to a collection list in my Model?
body: <p>For the sake of simplicity, let's say I have a <code>User</code> model that has a <code>List&lt;Email&gt;</code> as one of its properties.</p>
  
  <pre><code>public class UserModel
  {
      public string UserName { get; set; }
      public List&lt;Email&gt; Emails = new List&lt;Email&gt;();
  }
  
  public class Email
  {
      public string Address { get; set; }
  }
  </code></pre>
  
  <p>In my view, I have a list of the emails:</p>
  
  <pre><code>&lt;table&gt;
  @foreach(Email email in Model.Emails)
  {
      &lt;tr&gt;
          &lt;td&gt;@Html.EditorFor(modelItem =&gt; email.Address)&lt;/td&gt;
      &lt;/tr&gt;
  }
  &lt;/table&gt;
  </code></pre>
  
  <p>Now let's say I want the user to be able to click a button that adds a new row to the table so that the user can add a new Email to the List that is bound to their User. How do I do this? Do I need to add the new row via javascript in a certain way so that it gets bound to the model when the page is posted? I have no idea how to approach this as I'm relatively new to MVC coming from WebForms.</p>