Question

I’m trying to create a view that contains a list of checkboxes that is dynamically created from a database, and then retrieve the list of selected ones when the form is posted back.

My EF model contains a class:

public class ItemIWouldLikeACheckboxFor {
    public int Id { get; set; }
    public string Description { get; set; }
}

I have a view model that contains a list of these:

public class PageViewModel {
    // various other properties
    public List<ItemIWouldLikeACheckboxFor> checkboxList { get; set; }
}

My controller get method:

public ActionResult Create() {
    var viewModel = new PageViewModel();
    viewModel.checkboxList = db.ItemIWouldLikeACheckboxFors.ToList();
    return View(viewModel);
}

My view:

<% using (Html.BeginForm()) { %>
    <%-- other stuff here... %>

    <% foreach (var item in checkboxList) { %>
        <%: Html.CheckBox( <!-- what exactly ?????? -->) %>
    <% } %>

    <%-- other stuff here...%>
    <input type="submit" />
<% } %>

My controller post method:

[HttpPost]
public ActionResult Create(PageViewModel viewModel) {
    // do stuff with other fields

    // I would like to do something like:
    foreach (var item in selectedCheckBoxes) {
        // do stuff
    }
}

I can’t seem to get it to work. My basic questions are mixed in as comments in the code snippets, but to recap:

• Is my view model OK? (do I need to add anything to capture the selected ones as opposed to simply the list to display?)
• What exactly should I put in the view to render each check box?
• How do I access the selected checkboxes in the controller after the post?

Answer 1

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

We basically wrote our own control to render the HTML like

<label for="Products"> Select Products </label>
<ul class="checkBoxList">
<li>
    <input type="hidden" value="0" name="Products.Index">
    <input type="checkbox" value="3424" name="Products[0].Id" id="Products0">
    <label for="Products0">iPod touch 3rd Generation</label>
</li>
<li>
    <input type="hidden" value="1" name="Products.Index">
    <input type="checkbox" value="3123" name="Products[1].Id" id="Products1">
    <label for="Products1">Creative Zen</label>
</li>
</ul>
</div>

Model Looks Ok, we wrote a custom helper, so our aspx pages look like:

<%= Html.DropDownFor(m=>m.products) %>

If you follow phil haacks post, your model should automatically bind in your controller.