Should I Use Html.CheckBox or Html.CheckBoxFor?

Question

I have a view that will have data from text boxes and checkboxes posted back and saved to my db when the user hits submit. When the view is first loaded, some text boxes are loaded with data from the db for the user, and I'd also like certain checkboxes to be pre-checked as well. Here is what I've got so far in my Get method:

    //vm is an object of my ViewModel
    [HttpGet]
    public ActionResult AddOrganization(int peopleID = 0)
    {
        var peopleModel = db.People.Include("EmployeeContacts").Single(g => g.PeopleID == peopleID);
        var contactModel = db.EmployeeContacts.Include("People").Single(g => g.PeopleID == peopleID);
        vm.People = new People();
        vm.EmployeeContacts = new EmployeeContacts();
        vm.OrganizationsOptions = new OrganizationOptions();

        // grabs info from db to be populated in the view
        vm.People.NID = peopleModel.NID;
        vm.People.FirstName = peopleModel.FirstName;
        vm.People.LastName = peopleModel.LastName;
        vm.People.SID = peopleModel.SID;
        vm.EmployeeContacts.Email = contactModel.Email;
        vm.EmployeeContacts.PrimaryPhone = contactModel.PrimaryPhone;

        var list = new List<AddOrganizationViewModel>
        {
            new AddOrganizationViewModel{ID = 1, Name = "Admin", AdminChecked = true},
            new AddOrganizationViewModel{ID = 2, Name = "Breakdown Report", BreakdownReportChecked = true},
            new AddOrganizationViewModel{ID = 3, Name = "Favorites", FavoritesChecked = true},
            new AddOrganizationViewModel{ID = 4, Name = "Site Admin", SiteAdminChecked = false},
        };

        return View("../Setup/AddOrganization", vm);
    }

My ViewModel looks like this:

    public class AddOrganizationViewModel
    {
        public Music.Models.Organizations Organizations { get; set; }
        public Music.Models.People People { get; set; }
        public Music.Models.OrganizationOptions OrganizationsOptions { get; set; }
        public Music.Models.EmployeeContacts EmployeeContacts { get; set; }
        public int ID { get; set; }
        public string Name { get; set; }
        public bool AdminChecked { get; set; }
        public bool BreakdownReportChecked { get; set; }
        public bool FavoritesChecked { get; set; }
        public bool SiteAdminChecked { get; set; }
    }

And this is the part of my view that contains the checkboxes, but I'm not sure what I need to do here to link my ViewModel, Controller, and View together, since the view is expecting a type of AddOrganizationViewModel, I'm stuck on how to send in the list of checkboxes also.

@model Music.ViewModels.AddOrganizationViewModel

@using (Html.BeginForm("AddOrganization", "AddOrganization")){
@Html.AntiForgeryToken()
<legend>OPTIONS</legend>
<div>
    @Html.Label("Features: Admin")
    @Html.CheckBoxFor(Model => Model.AdminChecked)
</div>
<div>
    @Html.Label("Features: Breakdown Report")
    @Html.CheckBoxFor(Model => Model.BreakdownReportChecked)
</div>
<div>
    @Html.Label("Features: Favorites")
    @Html.CheckBoxFor(Model => Model.FavoritesChecked)
</div>
<div>
    @Html.Label("Features: Site Admin")
    @Html.CheckBoxFor(Model => Model.SiteAdminChecked)
</div>
}

Edit: updated code to reflect changes I've made using CheckBoxFor.

Answer 1

You shouldn't use 1 generic property for all your checkboxes.

I would just make a boolean property in my viewmodel for every feature you want the user to have access to.

public class AddOrganizationViewModel
    {
        public Music.Models.Organizations Organizations { get; set; }
        public Music.Models.People People { get; set; }
        public Music.Models.OrganizationOptions OrganizationsOptions { get; set; }
        public Music.Models.EmployeeContacts EmployeeContacts { get; set; }
        public int ID { get; set; }
        public string Name { get; set; }
        public bool HasAdminPermissions{ get; set; }
        public bool HasSomeOtherPermission{ get; set; }
        //etc.. for other checkboxes you might need.
    }

To prefill these checkboxes, set them in your controller with the properties we created in the viewmodel:

vm.HasSomeOtherPermission = true;
//etc for other properties

Lastly in your view, change @Html.CheckBox to @Html.CheckBoxFor . You can then just use the boolen properties on the viewmodel to render the checkboxes:

<legend>OPTIONS</legend>
@*Look into @html.checkboxfor *@
<div>
    @Html.Label("Features: Admin")
    @Html.CheckBoxFor(x => x.HasAdminPermissions)
</div>
<div>
    @Html.Label("Features: Breakdown Report")
    @Html.CheckBoxFor(x => x.HasSomeOtherPermission)
</div>