Question

I have this scenario. I have 10 checkboxes that need to be generated(this list could grow and comes from the database).

Now a user may only have 3 of the 10. I want to always show all 10 checkboxes to the user but only check the ones they have.

I am unsure how my viewmodel and page should look like? I am unsure which html helper to be using. If I need a property(bool) for each of the values in the database showing which value they have.

It my database I don’t have a bit value showing if they have it or not. I have a many to many relationship. A user can have many features and a feature can have many users.

Answer 1

Build view models to describe your User and Feature objects. Then, you could use an editor template to display the checkbox.

public class UserFeatureViewModel
{
    public string Name { get; set; }
    public IEnumerable<FeatureViewModel> Features { get; set; }
}

// and the FeatureViewModel
public class FeatureViewModel
{
    public string Name { get; set; }
    public bool IsSelected { get; set; }
}

I said build, so do that in your controller, view model factory or service. The Feature instances are hard-coded here, but you’d want to retrieve them from the db:

public class UserController : Controller
{
    public ActionResult GetUser(string username)
    {
        var model = new UserFeatureViewModel
        {
            Name = username,
            Features = new[]
            {
                new FeatureViewModel { Name = "Feature abc", IsSelected = true },
                new FeatureViewModel { Name = "Feature def", IsSelected = false },
                new FeatureViewModel { Name = "Feature xyz", IsSelected = true }
            }
        };
        return View(model);
    }
}

You can use subsequent actions with UserFeatureViewModel parameters for updating, etc.

Finally, the editor template in ~/Views/User/EditorTemplates/FeatureViewModel.cshtml would inherit a FeatureViewModel and use the Html.CheckBoxFor helper:

@model FeatureViewModel
<span>@Model.Name</span>
<span>@Html.CheckBoxFor(model => model.IsSelected)</span>

In your form (the “parent” view), use the EditorFor helper to render the partial

@Html.EditorFor(model => model.Features)