Umbraco: Create CheckBoxList property with prevalues from mvc model

Question

What I want to do is create a CheckBoxList property so the editor could choose facilities specific for current page (hotel name) in BO, and render content based on what is checked.

I've created a model:

public class Facility
{
    public int Id { get; set; }
    public string Description { get; set; }
    public string IconUrl { get; set; }

    public List<Facility> GetFacilities()
    {
        return new List<Facility>() 
        {  
            new Facility() { Id = 4, Description = "Free parking", IconUrl = "" },
            new Facility() { Id = 6, Description = "Spa", IconUrl = "" },
            new Facility() { Id = 7, Description = "Free Wifi", IconUrl = "" },
            new Facility() { Id = 2, Description = "Tennis", IconUrl = "" },
            new Facility() { Id = 9, Description = "Room service", IconUrl = "" },
            new Facility() { Id = 10, Description = "Fitness", IconUrl = "" }
        };
    }

}

How can I create a CheckBoxList with the values set in GetFacilities() method? Or should I create a new class in AppCode folder with this method? Where is the best place to put this kind of functionality, and how can I achieve this?

Answer 1

Your Facility model should contain a boolean value to indicate if its been selected

public class FacilityVM
{
  public int Id { get; set; }
  public string Description { get; set; }
  public bool IsSelected { get; set; }
{

public class HotelVM
{
  public int ID{ get; set; }
  ....
  public List<FacilityVM> Facilities { get; set; }
}

Controller

public ActionResult Edit(int ID)
{
  HotelVM model = new HotelVM();
  model.Facilities = // populate the list of available facilities
  // Get the hotel from repository and map properties to the view model
  return View(model);
}

public ActionResult Edit(HotelVM model)
{
  ...
  foreach(FacilityVM facility in model.Facilities)
  {
    if (facility.IsSelected)
    {
      // do something
    }
  }
  ....
}

View

@model HotelVM
@using (Html.BeginForm())
{
  // render properties of hotel
  ....
  for (int i = 0; i < Model.Facilities.Count; i++)
  {
    @Html.HiddenFor(m => m.Facilities[i].ID);
    @Html.HiddenFor(m => m.Facilities[i].Description);
    @Html.CheckBoxFor(m => m.Facilities[i].IsSelected)
    @Html.LabelFor(m => m.Facilities[i].IsSelected, Model.Facilities[i].Description)
  }
  <input type="submit" value="Save" />
}

Answer 2

I think you're thinking about this the wrong way as suggested by Stephen (unless I am misunderstanding your question). You are creating a list of key/value pairs and only one will be selected in the BO and so only one will published to the front-end (regardless of the use of it).

So, in the BO you only need a dropdown list with the key/values pairs. You can create this with the "Dropdown list (publishing keys)" datatype. Also consider using the "SQL dropdown" list datatype as this would give you far more flexibility.

If you then need to convert the selected ID into a Facility object, do this separately using a class implementing the IPropertyEditorValueConverter interface. See here for more information:

http://our.umbraco.org/documentation/extending-umbraco/Property-Editors/PropertyEditorValueConverters