Dropdown list in MVC view - asp.net-mvc

Question

I'm trying to create a dropdown list and I get nothing in the dropdown except 'Please select one' but no values.
I've tried this so far:
View:
<select asp-for="StatusToEdit.Color.Name" asp-items="Model.AvailableColors">
<option>Please select one</option>
</select>
Model:
public SelectList AvailableColors { get; set; }
public void OnGet()
{
AvailableColors = new SelectList(nameof(StatusColor.ColorId),
nameof(StatusColor.Name));
}
Mocklist:
private static List<ItemStatus> _mockStatuses = new List<ItemStatus>
{
new ItemStatus { StatusId = 1, Name = "Complete", Color = new
StatusColor{ ColorId = 1, Name = "Auto" } },
new ItemStatus { StatusId = 2, Name = "Complete, Ongoing", Color =
new StatusColor{ ColorId = 2, Name = "Green" }},
new ItemStatus { StatusId = 3, Name = "In Process", Color = new
StatusColor{ ColorId = 3, Name = "Yellow" }}
};
I expect to see all of the colors to show in the dropdown.

Answer 1

if you are using asp.net core MVC (Razor Pages is similar), you need to modify the model property type to IEnumerable<SelectListItem> AvailableColors or List<SelectListItem> AvailableColors
1.Model
public class ManageStatusesEditViewModel
{
//other properties
public List<SelectListItem> AvailableColors { get; set; }
}
2.Action:
[HttpGet]
public IActionResult ManageStatusesEdit(int id)
{
//other logic
var dropdownData = new List<SelectListItem>();
_mockStatuses.ForEach(d => dropdownData.Add(new SelectListItem()
{
Value = d.Color.Name,
Text = d.Color.Name
}));
var editManageStatusesEditViewModel = new ManageStatusesEditViewModel
{
AvailableColors = dropdownData
};
return View(editManageStatusesEditViewModel);
}
3.View:
<select asp-for="StatusToEdit.Color.Name" asp-items="Model.AvailableColors">
<option>Please select one</option>
</select>
4.Result:

Answer 2

You should create your list as below:
ViewBag.ColorList = new SelectList(_mockStatuses.Select(d=> { return new SelectListItem { Text = d.Color.Name, Value = d.Color.ColorId.ToString() }; }),"Value","Text");
I used ViewBag for it but you can obviously pass it to your view by a ViewModel if you prefer.
For your View you should do something as below:
<select asp-items="#ViewBag.ColorList" asp-for="StatusToEdit.Color.Name" >
<option value="">Please select one</option>
</select>
Please make sure you have added Value and Text at the end of SelectList when creating it.