How to do an MVC dropdownlist using IDictionary when it's not part of a table

Question

I had some code which in the razor file within a table set a dropdownlist using:

    foreach (var item in group) {
                <tr>
                    <td>
    ...
        @Html.DropDownListFor(modelItem => item.OfficeUserId, Model.OfficeApprovers, new { @class = "officeapproverddl", invoiceLineId = @item.InvoiceLineId, officeUserId = @item.OfficeUserId })
    ...
    </td>
    </tr>
}
    </table>

This worked well however now I want the same dropdown list outside the table. Hence there will be no item object to use.

How do you make this work outside the table ie. All I have to provide it now are Model.OfficeApprovers and the html attributes.

Model.OfficeApprovers is of type: new Dictionary<string, IEnumerable<SelectListItem>>();

Answer 1

Is there any reason why you are using Dictionary?

Below is code how I normally do it when populating a drop down. It is very simplistic, I suggest you use it as a base to build your drop down.

At the top of my view I specify my view model:

@model MyProject.ViewModels.MyViewModel

On my view I have a drop down list that displays all the banks that a user can select from:

<table>
     <tr>
          <td><b>Bank:</b></td>
          <td>
               @Html.DropDownListFor(
                    x => x.BankId,
                    new SelectList(Model.Banks, "Id", "Name", Model.BankId),
                    "-- Select --"
               )
               @Html.ValidationMessageFor(x => x.BankId)
          </td>
     </tr>
</table>

I always have a view model for a view, I never pass a domain object directly to the view. In this case my view model will contain a list of banks that will be populated from the database:

public class MyViewModel
{
     // Other properties

     public int BankId { get; set; }
     public IEnumerable<Bank> Banks { get; set; }
}

My bank domain model:

public class Bank
{
     public int Id { get; set; }
     public string Name { get; set; }
}

Then in my action method I create an instance of my view model and populate the banks list from the database. Once this is done then I return the view model to the view:

public ActionResult MyActionMethod()
{
     MyViewModel viewModel = new ViewModel
     {
          // Database call to get all the banks
          // GetAll returns a list of Bank objects
          Banks = bankService.GetAll()
     };

     return View(viewModel);
}

I hope this helps.

Answer 2

From here http://msdn.microsoft.com/en-us/library/ee703573.aspx we have that the DropDownListFor has this syntax:

public static MvcHtmlString DropDownListFor<TModel, TProperty>(
    this HtmlHelper<TModel> htmlHelper,
    Expression<Func<TModel, TProperty>> expression,
    IEnumerable<SelectListItem> selectList,
    Object htmlAttributes
)

You must provide an expression when constructing a DropDownListFor:

expression: System.Linq.Expressions.Expression(Of Func(Of TModel, TProperty))
An expression that identifies the object that contains the properties to render.

So the way you want to do it is not going to work with a DropDownListFor.

Your best bet in this case is to use the simple @Html.DropDownList. You can use this overload to achieve what you want:

public static MvcHtmlString DropDownList(
    this HtmlHelper htmlHelper,
    string name,
    IEnumerable<SelectListItem> selectList,
    IDictionary<string, Object> htmlAttributes
)

Sample:

@Html.DropDownList("officeApprovers", Model.OfficeApprovers,
                                                   new { @class = "officeapproverddl" }

Edit:

Try this one:

@Html.DropDownList("officeApprovers", Model.OfficeApprovers.Values[0],
                                                   new { @class = "officeapproverddl" }