How to pass complex object collections to the controller in mvc

Question

I'm new to MVC and sorry for this beginners question. I have following Model classes:

public class ReturnBookHedModel
{

    public int RefferenceID { get; set; }
    public int BorrowedRefNo { get; set; }
    public int MemberId { get; set; }
    public DateTime ReturnDate { get; set; }
    public bool IsNeedToPayFine { get; set; }       
    public DateTime CurrentDate { get; set; }

    public virtual List<ReturnBookDetModel> RetunBooks { get; set; }
    public virtual MemberModel member { get; set; }
}

public class ReturnBookDetModel
{

    public int BookID { get; set; }
    public int RefferenceID { get; set; }
    public bool IsReturned { get; set; }
    public virtual ReturnBookHedModel ReturnBookHed { get; set; }
    public virtual BookModel book { get; set; }
}

I have following controller methods:

    public ActionResult SaveReturnBook(int refNo)
    {
        ReturnBookHedModel model = ReturnBookFacade.GetReturnBookBasedOnRefference(refNo);
        return View(model);
    }

    //
    // POST: /ReturnBook/Create

    [HttpPost]
    public ActionResult SaveReturnBook(ReturnBookHedModel model)
    {
        try
        {
            // TODO: Add insert logic here

            return RedirectToAction("Index");
        }
        catch
        {
            return View();
        }
    }

in my model i define as follows:

     <div class="control-label">
          @Html.LabelFor(model => model.BorrowedRefNo)
          @Html.TextBoxFor(model => model.BorrowedRefNo, new { @class = "form-control" ,@readonly = "readonly" })
          @Html.ValidationMessageFor(model => model.BorrowedRefNo)

     </div>
      // rest of the header details are here
    <table>
        <tr>                                   
            <th>
                @Html.DisplayNameFor(model => model.RetunBooks.FirstOrDefault().IsReturned)
             </th>
             <th>
                 @Html.DisplayNameFor(model => model.RetunBooks.FirstOrDefault().BookID)
             </th>
              <th>
                 @Html.DisplayNameFor(model => model.RetunBooks.FirstOrDefault().book.BookName)
              </th>
              <th></th>
            </tr>

            @foreach (var item in Model.RetunBooks)
             {
                <tr >                                        
                   <td>
                       @Html.CheckBoxFor(modelItem => item.IsReturned)
                   </td>
                   <td>
                       @Html.HiddenFor(modelItem => item.BookID);
                       @Html.DisplayFor(modelItem => item.BookID)
                    </td>
                    <td>
                       @Html.DisplayFor(modelItem => item.book.BookName)
                     </td>
                  </tr>
                }
</table>

this is working fine.. but these table details (complex objects) are not in the controller's post method. when i searched i found that i can use this detail data as follows: but i cant use it as follows.

  @for (var i = 0; i < Model.RetunBooks.Count; i++) 
   {
      <tr>                                        
          <td>
              @Html.CheckBoxFor(x => x.RetunBooks.)
           </td>                                        
       </tr>
    }

how can i send these information to controller

Answer 1

In order for the collection to be posted back you need to index them in the following way for the model binder to pick them up.

This should do the trick:

 @for (var i = 0; i < Model.RetunBooks.Count; i++) 
 {
      ...
      @Html.CheckBoxFor(model => Model.RetunBooks[i].IsReturned)
      ...
 }

Complex objects require the indexing in the above manner.

For more info on it see here:

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