Binding DropDownList in asp.net MVC PartialView

Question

I have a partialView that has a <select> that holds a list of available Roles for the user being registered. I'm new to MVC and I'm struggling to figure out how to bind the <select>.

Normally I would do this on the Page_Load of an ascx, for example:

rolesSelect.DataSource = Roles.GetAllRoles().OrderBy(r => r);
rolesSelect.DataBind();

But with MVC it's completely different. My view and partialView look something like this:

Users.cshtml

@model IEnumerable<RobotDog.Models.UserModel>

<table>...</table>
<div id="addUser">
    @Html.RenderPartial("_AddUser")
</div>

_AddUser.cshtml

@model RobotDog.Models.RegisterModel

@using(Html.BeginForm("AddUser","Admin", FormMethod.Post)) {
    @Html.EditorFor(x => x.Email, new { @class = "input-xlarge", @placeholder = "Email"})
    @Html.EditorFor(x => x.UserName, new { @class = "input-xlarge", @placeholder = "User Name"})
    @Html.EditorFor(x => x.Password, new { @class = "input-xlarge", @placeholder = "Password"})
    @Html.DropDownListFor(????) //not sure how to bind this?
}

My questions are:

Do I need to pass the appropriate collection from the controller to the view to the partialView or is there a more practical scalable approach?
Is it possible to have a controller for the partialView so that I would only have to worry about adding the partialView to the view and not the views' controller?
This really all boils down to what is the standard practice for binding a collection of data to a DropDownList in a PartialView?

This seems to be implying that users will only ever be in one role, is that correct? — Stafford Williams
– Stafford Williams, Commented Aug 31, 2012 at 2:33

McGarnagle · Accepted Answer · 2012-09-01 02:52:31Z

2

Add the Roles collection to the model, and construct the select list as needed.

@Html.DropDownListFor(x => x.Role, 
    Model.Roles.Select(role => 
        new SelectListItem() { Text = role.Name, Value = role.Value }
    )
)

An alternative to adding Roles to the model is to create an HTML Helper method. It's an extension method, so add it like this:

namespace ExtensionMethods
{
    public static class HtmlHelperExtensions
    {
        public static IEnumerable<SelectListItem> GetRoles(this HtmlHelper helper)
        {
            return new[] {
                new SelectListItem() { Text="Role1" },
                new SelectListItem() { Text="Role2" },
            };
        }
    }
}

Then register the namespace in the Web.Config under the Views folder:

<system.web.webPages.razor>
    <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>
        <add namespace="ExtensionMethods"/>
      </namespaces>
    </pages>
</system.web.webPages.razor>

Now you can create the drop-down list:

@Html.DropDownListFor(x => x.Role, Html.GetRoles())

edited Sep 1, 2012 at 2:52

answered Aug 31, 2012 at 2:33

McGarnagle

103k31 gold badges235 silver badges264 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

bflemi3 Over a year ago

Dumb question - how to add the Roles collection to the model? Thanks dbaseman

McGarnagle Over a year ago

@bflemi3 I was just thinking add a property to the model class, and initialize it in the controller. But whatever works for you. (could also put it in the ViewBag, or make an HTML helper).

bflemi3 Over a year ago

Sorry, it's late, I'm not thinking straight. I can't have a public Roles Roles { get; } property. How would I add it to the model?

R. Schreurs Over a year ago

At first sight, I liked the extension method solution, but while implementing it, I realised that I need to obtain data for the actual row data. From a separation of concerns point of view, I am not sure if I want to add this code to an html extension method. Any views on this?

Collectives™ on Stack Overflow

Binding DropDownList in asp.net MVC PartialView

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related