title: MVC 5 BeginCollectionItem with Partial CRUD
body: <p>I have made changes below to the question, which is still the same but hopefully a lot clearer through the models and in regards to what I want to achieve and where I've come up against issues.</p>
  
  <p>Below are shown two classes, Company and Employee, Company has a list of Employees.</p>
  
  <p>This will be an input form so there will be no data in there to begin with.</p>
  
  <p>Ultimately I want the user to be able to add as many Employee objects to the Company object model as they want and for the Employee objects to be updated </p>
  
  <p>Am I on the right track with using BeginCollectionItem so I can add/remove as many Employee objects as I want? 
  When I click on the Add button it takes it to the partial view on another page (with AjaxActionLink) but not with JavaScript.</p>
  
  <p><strong>Update</strong>
  Removed AjaxActionLink and used JavaScript instead.</p>
  
  <p><strong>Index</strong></p>
  
  <pre><code>@model MvcTest.Models.Company
  @{
      ViewBag.Title = "Index";
      Layout = "~/Views/Shared/_Layout.cshtml";
  }
  
  &lt;h2&gt;Company&lt;/h2&gt;
  &lt;div&gt;
      @Html.LabelFor(m =&gt; m.Name)
      @Html.EditorFor(m =&gt; m.Name)
  &lt;/div&gt;
  &lt;fieldset&gt;
      &lt;legend&gt;Employees&lt;/legend&gt;
      &lt;div id="new-Employee"&gt;
          @foreach (var Employee in Model.Employees)
          {
              Html.RenderPartial("_Employee", Employee);
          }
      &lt;/div&gt;
      &lt;div&gt;
          &lt;input type="button" id="addemployee" name="addemployee" value="Add Employee"/&gt;
          &lt;br/&gt;
      &lt;/div&gt;
      &lt;br/&gt;
      @section Scripts
      {
          &lt;script type="text/javascript"&gt;
              $('#addemployee').on('click', function () {
                  $.ajax({
                      async: false,
                      url: '/Company/AddNewEmployee'
                  }).success(function (partialView) {
                      $('#new-Employee').append(partialView);
                  });
              });
          &lt;/script&gt;
      }
  &lt;/fieldset&gt;
  &lt;div&gt;
      &lt;input type="submit" value="Submit" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>_Employee PartialView</strong></p>
  
  <pre><code>    @model MvcTest.Models.Employee
  
  @using (Html.BeginCollectionItem("Employees"))
  {
      &lt;div class="employeeRow"&gt;
          @Html.LabelFor(m =&gt; m.Name)
          @Html.EditorFor(m =&gt; m.Name)
  
          @Html.LabelFor(m =&gt; m.Telephone)
          @Html.EditorFor(m =&gt; m.Telephone)
  
          @Html.LabelFor(m =&gt; m.Mobile)
          @Html.EditorFor(m =&gt; m.Mobile)
  
          @Html.LabelFor(m =&gt; m.JobTitle)
          @Html.EditorFor(m =&gt; m.JobTitle)
  
          &lt;a href="#" class="deleteRow"&gt;Delete&lt;/a&gt;
      &lt;/div&gt;
  }
  
  @section Scripts
  {
  $("a.deleteRow").live("click", function(){
      $(this).parents("div.employeeRow:first").remove();
  return false;
  });
  }
  </code></pre>
  
  <p><strong>Controller</strong></p>
  
  <pre><code>public class CompanyController : Controller
      {
          // GET: Company
          public ActionResult Index()
          {
              var newCompany = new Company();
              return View(newCompany);
          }
          public ActionResult AddNewEmployee()
          {
              var employee = new Employee();
              return PartialView("_Employee", employee);
          }
      }
  </code></pre>
  
  <p><strong>Model</strong></p>
  
  <pre><code>public class Company
      {
          [Key]
          public int Id { get; set; }
          [Display(Name = "Company")]
          public string Name { get; set; }
          public List&lt;Employee&gt; Employees { get; set; }
  
          //public Company()
          //{
          //    Employees = new List&lt;Employee&gt;
          //    {
          //        new Employee{ Name = "Enter name"}
          //    };
          //}
      }
      public class Employee
      {
          [Key]
          public int Id { get; set; }
          [Display(Name="Employee")]
          public string Name { get; set; }
          public string Telephone { get; set; }
          public string Mobile {get;set;}
          [Display(Name="Job Title")]
          public string JobTitle {get;set;}
      }
  </code></pre>