Setting Default Value in Html.DropDownList Helper

Question

I have searched but have not been successful in getting a default value selected in a dropdownlist.

The following property does not reside in my MVC project, it is in my Core. Therefore, I didn't want to reference the System.Web.Mvc and used a Dictionary instead.

    [Display(Name = "Time Zone")]
    public int TimeZone { get; set; }
    public Dictionary<string, string> TimeZoneOptions
    {
        get
        {
            Dictionary<string, string> d = new Dictionary<string, string>();
            d.Add("(GMT -10:00) Hawaii", "-10");
            d.Add("(GMT -9:00) Alaska", "-9");
            d.Add("(GMT -8:00) Pacific Time", "-8");
            d.Add("(GMT -7:00) Mountain Time", "-7");
            d.Add("(GMT -6:00) Central Time", "-6");
            d.Add("(GMT -5:00) Eastern Time", "-5");
            d.Add("Unknown", "0");
            return d;
        }
    }

I created a CreateViewModel in my MVC project so that I could convert the above Dictionary into a SelectList with a preselected Default value.

    public class CreateViewModel
{
    public SelectList GetUserTimeZoneList(string selectedValue)
    {
        return new SelectList(new BankUser().TimeZoneOptions, "Value", "Key", selectedValue);
    }
}

My view (notice the "-7" as the default value being passed)

    <div class="form-group">
        @Html.LabelFor(model => model.TimeZone, new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownListFor(model => model.TimeZone, new CreateViewModel().GetUserTimeZoneList("-7"), new { @class = "form-control" })
            @Html.ValidationMessageFor(model => model.TimeZone)
        </div>
    </div>

The Results

    <select class="form-control" data-val="true" data-val-number="The field Time Zone must be a number." data-val-required="The Time Zone field is required." id="TimeZone" name="TimeZone">
<option value="-10">(GMT -10:00) Hawaii</option>
<option value="-9">(GMT -9:00) Alaska</option>
<option value="-8">(GMT -8:00) Pacific Time</option>
<option value="-7">(GMT -7:00) Mountain Time</option>
<option value="-6">(GMT -6:00) Central Time</option>
<option value="-5">(GMT -5:00) Eastern Time</option>
<option selected="selected" value="0">Unknown</option>
</select>

As you can see, "Mountain Time" was not selected. It always selects "Unknown". Any advice on what I am doing wrong?

Answer 1

It appears I overlooked an important aspect of the DropDownListFor helper. The first parameter of the control is actually the value that will be selected by default.

@Html.DropDownListFor(model => model.TimeZone, new SelectList(Model.TimeZoneOptions, "Value", "Key"), new { @class = "form-control" })

So when I pass the model to the view, it should be prepopulated with the correct default value like this:

    public ActionResult Create()
    {
        BankUser user = new BankUser();
        user.TimeZone = -7;
        return View(user);
    }

Therefore, I no longer need the original CreateViewModel class.

Answer 2

When you use Html.DropDownListFor you are overriding the selected value. If you want the -7 as the default selected (such as a create form) populate the value of Model.TimeZone as -7 by default. Optionally you can use the Html.DropDownList function.

@Html.DropDownList("TimeZone", new CreateViewModel().GetUserTimeZoneList("-7"), new { @class = "form-control" })

Of course, then you will lose the value of TimeZone on an edit form.