title: Dynamically adding items into view and posting back to controller (ASP.NET MVC 4)
body: <p>I have a ASP.NET MVC 4 app with model, that contains and colection (<code>IEnumerable&lt;T&gt;</code> or <code>IList&lt;T&gt;</code>), i.e.:</p>
  
  <pre><code>class MyModel
  {
    public int Foo { get; set; }
    public IList&lt;Item&gt; Bar { get; set; }
  }
  
  class Item
  {
    public string Baz { get; set; }
  }
  </code></pre>
  
  <p>And I render the data in view with classic <code>@for...</code>, <code>@Html.EditorFor...</code> ad so on. Now there's a need to add <em>on client side</em> to add dynamically new items and then post it back to server.</p>
  
  <p>I'm looking for an easy solution to handle the adding (in JavaScript), aka not manually creating all the inputs etc. Probably to get it somehow from editor template view. And to add it the way that when the form is submitted back to server the model binder will be able to properly create the <code>IList&lt;T&gt;</code> collection, aka some smart handling of inputs' names. I read a bunch of articles, but nothing that was easy and worked reliably (without magic strings like collection variable names, AJAX callbacks to server, ...).</p>
  
  <p>So far <a href="http://blog.stevensanderson.com/2010/07/12/editing-a-variable-length-list-knockout-style/" rel="nofollow">this</a> looks promising, but I'd like to rather rely on rendering (items known in advance) on server. </p>