Looping with a Html.CheckBoxFor

Question

I want to produce the below list of typed checkbox

When i inspect each checkbox (eg levelOne) i want to see each having a unique ID and name like the below

I have a Service (ReplayService) that provides a list of objects (HierarchyLevels) which will be used to create the list of Checkboxes

     public IEnumerable<HierarchyLevels> GetHierarchyLevels()
    {
        return new List<HierarchyLevels>()
        {
            new HierarchyLevels{Name="LevelOne",ShortName="L1", IsSelected = false},
            new HierarchyLevels{Name="LevelTwo",ShortName="L2", IsSelected = false},
            new HierarchyLevels{Name="TLevelThree",ShortName="L3", IsSelected = false},
            new HierarchyLevels{Name="LevelFour",ShortName="L4", IsSelected = false},

        };
    }

My Controller Class uses the List of HierarchyLevels (created by the service) to create a new Object viewModel.HierarchyLevels (In the Model) of type IEnumerable

        public ActionResult Index()
    {
        var vm = new MyViewModel();
        PopulateViewModel(vm.viewModel);
        return View(viewModel);
    }

    private void PopulateViewModel(ContentReplayViewModelBase viewModel)
    {
        var hierarchyLevels = replayService.GetHierarchyLevels();
        viewModel.HierarchyLevels = hierarchyLevels.Select(h => new SelectListItem {Text = h.Name, Selected = h.IsSelected}).ToArray();
    }

My Model class has defined properties for each checkbox that will be created.

    public abstract class ReplayViewModelBase
{
    public IEnumerable<SelectListItem> HierarchyLevels { get; set; }
    ....
    ....
}

 public class ReplayByHierarchyLevels : ReplayViewModelBase
{
    public bool levelOne { get; set; }
    public bool leveltwo { get; set; }
    public bool levelThree { get; set; }
    public bool levelFour { get; set; }
    .....
    .....   
}

In my View i an looping through the list of HierarchyLevels and producing a List of checkbox. the problem I'm having is I'm not sure how to loop through the list of objects and assign a unique bool property in the Model. In the code snippet below I'm assigning bool property "levelOne" to all the created checkbox (as a result all have the same ID and Name)

@foreach (var level in Model.ReplayByHierarchyLevels.HierarchyLevels)
{
    <tr>
        <td>@level.Text</td>
        <td>@Html.CheckBox(level.Text, level.Selected)</td>
        <td>** @Html.CheckBoxFor(x => x.ReplayByHierarchyLevels.levelOne, Model.ReplayByHierarchyLevels.levelOne = level.Selected)</td>
    </tr>
}

Answer 1

personally, I would just bind to the HierarchyLevels , so the checkbox view will be:

@for(int i =0; i <  Model.ReplayByHierarchyLevels.HierarchyLevels.Count; i++)
{
    <tr>
        <td>@Model.ReplayByHierarchyLevels.HierarchyLevels[i].Text</td>
        <td>
            @Html.CheckBoxFor(m => m.ReplayByHierarchyLevels.HierarchyLevels[i].Selected)
            @Html.HiddenFor(m => m.ReplayByHierarchyLevels.HierarchyLevels[i].Text)
            @Html.HiddenFor(m => m.ReplayByHierarchyLevels.HierarchyLevels[i].Value)
        </td>
    </tr>
}

then if you want strong type of access, you could change the view model ReplayByHierarchyLevels to do:

public class ReplayByHierarchyLevels : ReplayViewModelBase
{
    // be aware may be null
    public bool levelOne { get{return HierarchyLevels.FirstOrDefault(x => x.Text == "levelOne").Selected;} }

    // rest the same
}