Issues with DropDownList in MVC

Question

`//View <tr><td>Experience level</td><td><div class="editor-field">
                    <%: Html.DropDownListFor(model => model.ExperienceLevelID, (SelectList)ViewData["Experience"], "--select--")%>
                    <%: Html.ValidationMessageFor(model => model.ExperienceLevelID) %>
                </div></td></tr>`<tr><td>Size of Company</td><td><div class="editor-field">

                <%: Html.DropDownList("Value", (SelectList)ViewData["size"], "--select--")%>

 public ActionResult Create()//Controller
    {
        ViewBag.mode = "create";IExperienceLevelRepository expLevelResp = new ExperienceLevelRepository();
        IQueryable<ExperienceLevel> expLevel = expLevelResp.GetAllExperienceLevels().OrderBy(ExperienceLevel => ExperienceLevel.Name);
        ViewData["Experience"] = new SelectList(expLevel, "ID", "Name");


        IEnumerable<SelectListItem> companySizes = new List<SelectListItem>
                                             {

                                                 new SelectListItem
                                                     {
                                                       Text = "Large Company",
                                                          Value = "large"

                                                     }
                                             };
        ViewData["size"] = new SelectList(companySizes, "Value", "Text");



        return View();
    } 

The above dropdownlist works fine for the ViewData["Experience"] But it doesnt works with size , I have to manually hardcode the dropdownlist for size and the experience dropdownlist is populated from db. The error which i m getting for size dropdownlist is :There is no ViewData item of type 'IEnumerable' that has the key 'Value'.

Any help or suggestions will be highly appreciated.

Answer 1

I would very strongly recommend you to use view models and strongly typed views instead of ViewData and weakly typed helpers as they lack Intellisense and are source of many errors and ugly views.

Model:

public class MyViewModel
{
    [Required]
    public string SelectedExperienceId { get; set; }
    public IEnumerable<SelectListItem> Experiences { get; set; }

    [Required]
    public string SelectedSizeId { get; set; }
    public IEnumerable<SelectListItem> Sizes { get; set; }
}

Controller:

public ActionResult Index()
{
    var model = new MyViewModel
    {
        Experiences = new[]
        {
            new SelectListItem { Value = "exp1", Text = "Experience 1" },
            new SelectListItem { Value = "exp2", Text = "Experience 2" },
            new SelectListItem { Value = "exp3", Text = "Experience 3" },
        },
        Sizes = new[]
        {
            new SelectListItem { Value = "s1", Text = "Size 1" },
            new SelectListItem { Value = "s2", Text = "Size 2" },
            new SelectListItem { Value = "s3", Text = "Size 3" },
        }
    };
    return View(model);
}

Strongly typed view:

<%@ Page 
    Language="C#" 
    MasterPageFile="~/Views/Shared/Site.Master"     
    Inherits="System.Web.Mvc.ViewPage<AppName.Models.MyViewModel>" 
%>

...    

<%= Html.DropDownListFor(
    x => x.SelectedExperienceId,
    new SelectList(Model.Experiences, "Value, "Text"),
    "-- Experience --"
) %>
<%= Html.ValidationMessageFor(x => x.SelectedExperienceId) %>

...

<%= Html.DropDownListFor(
    x => x.SelectedSizeId,
    new SelectList(Model.Sizes, "Value, "Text"),
    "-- Size --"
) %>
<%= Html.ValidationMessageFor(x => x.SelectedSizeId) %>

Now all that's left is replace the hardcoded values with ones coming from your database, by mapping the returned resultset from the repository into IEnumerable<SelectListItem>.