Question

I have a Razor page with a drop down list inside a form:

@using (Html.BeginForm("ProductsByOwners", "Report", FormMethod.Post, new { @id = "ProductsByOwners" }))
{            
    @Html.Label("Choose product owner: ")
    @Html.DropDownList("OwnerList", (SelectList)ViewBag.OwnerList, new { @onchange = "this.form.submit();" })    
}

The selected value of my SelectList is not being carried over to the DropDownList. I’ve debugged and stepped through the code and found that (SelectList)ViewBag.OwnerList evaluates properly and has the expected value selected, but the resulting HTML does not have any of the option tags selected.

Can anyone see what I’m doing wrong here?

UPDATED

Here is how the SelectList is created in my action:

ViewBag.OwnerList = new SelectList(ListUtils.ProductOwners(), "Key", "Value", values["OwnerList"]);

The result has the value indicated by values["OwnerList"] selected.

Thanks!

Answer 1

You are not using the DropDownList helper properly. In order to create a dropdownlist you need 2 things:

1. a scalar property to bind to the selected value when the form is submitted
2. a collection to bind the options to

In your example you have only one of those 2 things (the second). Your first argument is called OwnerList and you have ViewBag.OwnerList passed as second argument.

So:

@Html.DropDownList(
    "SelectedOwnerId", 
    (SelectList)ViewBag.OwnerList, 
    new { @onchange = "this.form.submit();" }
)

---

Obviously I would recommend you using strongly typed views ans view models. And obviously get rid of the weakly typed ViewBag/ViewData/ViewCrap.

So start by designing a view model to meet the requirements of your view (which from what you have shown so far is to display a dropdownlist):

public class OwnerViewModel
{
    [DisplayName("Choose product owner: ")]
    public string SelectedOwnerId { get; set; }

    public IEnumerable<SelectListItem> OwnerList { get; set; }
}

then a controller:

public class ReportController: Controller
{
    public ActionResult ProductsByOwners()
    {
        var model = new OwnerViewModel
        {
            // preselect the second owner
            SelectedOwnerId = "2",

            // obviously those come from your database or something
            OwnerList = new[] 
            {
                new SelectListItem { Value = "1", Text = "owner 1" },
                new SelectListItem { Value = "2", Text = "owner 2" },
                new SelectListItem { Value = "3", Text = "owner 3" },
            }
        };
        return View(model);
    }

    [HttpPost]
    public ActionResult ProductsByOwners(OwnerViewModel model)
    {
        ...
    }
}

and you have a corresponding strongly typed view:

@model OwnerViewModel
@using (Html.BeginForm("ProductsByOwners", "Report", FormMethod.Post, new { id = "ProductsByOwners" }))
{            
    @Html.LabelFor(x => x.SelectedOwnerId)
    @Html.DropDownListFor(
        x => x.SelectedOwnerId, 
        Model.OwnerList, 
        new { onchange = "this.form.submit();" }
    )
}