Populating a razor dropdownlist from a List object in MVC

Question

I have a model   public class DbUserRole               public int UserRoleId   get  set            public string UserRole   get  set           public class DbUserRoles               public List lt DbUserRole gt  GetRoles                         BugnetReports RoleDropDown   new BugnetReports                List lt DbUserRole gt  Roles   new List lt DbUserRole gt                 DataSet table   RoleDropDown userRoleDropDown                foreach  DataRow item in table Tables 0  Rows                                DbUserRole ur   new DbUserRole                    ur UserRole   Convert ToString item  UserRoleName                     ur UserRoleId   Convert ToInt32 item  UserRoleID                     Roles Add ur                             return Roles                    And here is the Controller that loads the view                         GET   Admin AddNewUser          public ActionResult AddNewUser                         DbUserRoles Roles   new DbUserRoles                return View Roles GetRoles                 I can get the items in the list to display using a  foreach loop as shown below    foreach  var item in Model                       lt tr gt                  lt td gt                      item UserRoleId                 lt  td gt                  lt td gt                      item UserRole                 lt  td gt              lt  tr gt             But how do I populate a dropdownlist with the model that is passed through  I have tried    Html DropDownListFor x   gt  x UserRole   but I m having no luck

User · Answer

model AdventureWork CRUD WebApp4 Models EmployeeViewModel        ViewBag Title    Detalle       Layout      Views Shared  Layout cshtml       lt h2 gt Ingresar Usuario lt  h2 gt    using  Html BeginForm            Html AntiForgeryToken    lt div class  form-horizontal  gt         lt hr   gt       Html ValidationSummary true      new    class    text-danger           lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonType  labelText   Tipo de Persona   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html DropDownListFor model   gt  model Employee PersonType  new List lt SelectListItem gt                          new SelectListItem  Text   SC   Value    SC                    new SelectListItem  Text   VC   Value    VC                       new SelectListItem  Text   IN   Value    IN                    new SelectListItem  Text   EM   Value    EM                     new SelectListItem  Text   SP   Value    SP                htmlAttributes  new    class    form-control                  Html ValidationMessageFor model   gt  model Employee PersonType      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeGender  labelText   Genero   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html DropDownListFor model   gt  model Employee EmployeeGender  new List lt SelectListItem gt                      new SelectListItem  Text   Masculino   Value    M                new SelectListItem  Text   Femenino   Value    F              htmlAttributes  new    class    form-control                  Html ValidationMessageFor model   gt  model Employee EmployeeGender      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonTitle  labelText   Titulo   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee PersonTitle  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee PersonTitle      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonFirstName  labelText   Primer Nombre   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee PersonFirstName  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee PersonFirstName      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonMiddleName  labelText   Segundo Nombre   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee PersonMiddleName  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee PersonMiddleName      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonLastName  labelText   Apellido   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee PersonLastName  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee PersonLastName      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee PersonSuffix  labelText   Sufijo   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee PersonSuffix  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee PersonSuffix      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee DepartmentID  labelText   Departamento   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html DropDownListFor model   gt  model Employee DepartmentID  new SelectList Model ListDepartment   DepartmentID    DepartmentName    htmlAttributes  new    class    form-control                  Html ValidationMessageFor model   gt  model Employee DepartmentID      new    class    text-danger              lt  div gt       lt  div gt         lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeMaritalStatus  labelText   Estado Civil   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html DropDownListFor model   gt  model Employee EmployeeMaritalStatus  new List lt SelectListItem gt                      new SelectListItem  Text   Soltero   Value    S                new SelectListItem  Text   Casado   Value    M              htmlAttributes  new    class    form-control                  Html ValidationMessageFor model   gt  model Employee EmployeeMaritalStatus      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee ShiftId  labelText   Turno   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html DropDownListFor model   gt  model Employee ShiftId  new SelectList Model ListShift   ShiftId    ShiftName    htmlAttributes  new    class    form-control                  Html ValidationMessageFor model   gt  model Employee ShiftId      new    class    text-danger              lt  div gt       lt  div gt          lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeLoginId  labelText   Login   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee EmployeeLoginId  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee EmployeeLoginId      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeNationalIDNumber  labelText   Identificacion Nacional   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee EmployeeNationalIDNumber  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee EmployeeNationalIDNumber      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeJobTitle  labelText   Cargo   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee EmployeeJobTitle  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee EmployeeJobTitle      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeBirthDate  labelText   Fecha Nacimiento   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee EmployeeBirthDate  new   htmlAttributes   new    class    form-control datepicker                    Html ValidationMessageFor model   gt  model Employee EmployeeBirthDate      new    class    text-danger              lt  div gt       lt  div gt        lt div class  form-group  gt           Html LabelFor model   gt  model Employee EmployeeSalariedFlag  labelText   Asalariado   htmlAttributes  new    class    control-label col-md-2              lt div class  col-md-10  gt               Html EditorFor model   gt  model Employee EmployeeSalariedFlag  new   htmlAttributes   new    class    form-control                    Html ValidationMessageFor model   gt  model Employee EmployeeSalariedFlag      new    class    text-danger              lt  div gt       lt  div gt          lt div class  form-group  gt           lt div class  col-md-offset-2 col-md-10  gt               lt input type  submit  value  Guardar  class  btn btn-default    gt           lt  div gt       lt  div gt       lt div class  form-group  gt           lt div class  col-md-offset-2 col-md-10  style  color green  gt               ViewBag Message          lt  div gt           lt div class  col-md-offset-2 col-md-10  style  color red  gt               ViewBag ErrorMessage          lt  div gt       lt  div gt   lt  div gt

User · Answer

Instead of a List lt UserRole gt   you can let your Model contain a SelectList lt UserRole gt   Also add a property SelectedUserRoleId to store    well    the selected UserRole s Id value   Fill up the SelectList  then in your View use    Html DropDownListFor x   gt  x SelectedUserRoleId  x UserRole    and you should be fine   See also http   msdn microsoft com en-us library system web mvc selectlist v vs 108  aspx

User · Answer

One way might be        lt select name  listbox  id  listbox  gt       foreach  var item in Model                                    lt option value   item UserRoleId  gt                         item UserRole                      lt  option gt                                      lt  select gt

User · Answer

I m going to approach this as if you have a Users model   Users cs  public class Users        Key      public int UserId   get  set          Required      public string UserName   get  set         public int RoleId   get  set          ForeignKey  RoleId        public virtual DbUserRoles DbUserRoles   get  set        and a DbUserRoles model that represented a table by that name in the database   DbUserRoles cs  public partial class DbUserRoles        Key      public int UserRoleId   get  set          Required       StringLength 30       public string UserRole   get  set        Once you had that cleaned up  you should just be able to create and fill a collection of UserRoles  like this  in your Controller   var userRoleList   GetUserRolesList    ViewData  userRoles     userRolesList    and have these supporting functions   private static SelectListItem    UserRolesList        lt summary gt      Returns a static category list that is cached      lt  summary gt       lt returns gt  lt  returns gt  public SelectListItem   GetUserRolesList         if   UserRolesList    null                var userRoles   repository GetAllUserRoles   Select a   gt  new SelectListItem                           Text   a UserRole               Value   a UserRoleId ToString               ToList             userRoles Insert 0  new SelectListItem     Value    0   Text    -- Please select your user role --                UserRolesList   userRoles ToArray                  Have to create new instances via projection        to avoid ModelBinding updates to affect this        globally     return  UserRolesList          Select d   gt  new SelectListItem                  Value   d Value           Text   d Text              ToArray        Repository cs  My Repository function GetAllUserRoles   for the function  above   public class Repository       Model1 db   new Model1       Entity Framework context         User Roles     public IList lt DbUserRoles gt  GetAllUserRoles                 return db DbUserRoles OrderBy e   gt  e UserRoleId  ToList              AddNewUser cshtml  Then do this in your View    lt table gt       lt tr gt           lt td gt               Html EditorFor model   gt  model UserName                    htmlAttributes  new    class    form-control                                 lt  td gt           lt td gt               Html DropDownListFor model   gt  model RoleId                    new SelectList   IEnumerable lt SelectListItem gt  ViewData  userRoles     Value    Text   model RoleId                     htmlAttributes  new    class    form-control                                  lt  td gt        lt  tr gt    lt  table gt

User · Answer

Html DropDownList  ddl  Model Select item   gt  new SelectListItem       Value   item RecordID ToString        Text   item Name ToString         Selected    select     item RecordID ToString

User · Answer

Something close to    Html DropDownListFor m   gt  m UserRole      new SelectList Model Roles   UserRoleId    UserRole   Model Roles First   UserRoleId       new      any html  attributes here          You need a SelectList to populate the DropDownListFor   For any HTML attributes you need  you can add   new    class    DropDown    id    dropdownUserRole

User · Answer

Your call to DropDownListFor needs a few more parameters to flesh it out    You need a SelectList as in the following SO question   MVC3 DropDownListFor - a simple example   With what you have there  you ve only told it where to store the data  not where to load the list from

User · Answer

You can separate out your business logic into a viewmodel  so your view has cleaner separation   First create a viewmodel to store the Id the user will select along with a list of items that will appear in the DropDown   ViewModel   public class UserRoleViewModel          Display Attribute will appear in the Html LabelFor      Display Name    User Role        public int SelectedUserRoleId   get  set        public IEnumerable lt SelectListItem gt  UserRoles   get  set        References    DisplayAttribute   Inside the controller create a method to get your UserRole list and transform it into the form that will be presented in the view   Controller   private IEnumerable lt SelectListItem gt  GetRoles         var dbUserRoles   new DbUserRoles        var roles   dbUserRoles                  GetRoles                    Select x   gt                          new SelectListItem                                                               Value   x UserRoleId ToString                                    Text   x UserRole                                      return new SelectList roles   Value    Text       public ActionResult AddNewUser         var model   new UserRoleViewModel                                               UserRoles   GetRoles                              return View model       References    SelectListItem SelectList Constructor  IEnumerable  String  String    Now that the viewmodel is created the presentation logic is simplified  View    model UserRoleViewModel   Html LabelFor m   gt  m SelectedUserRoleId   Html DropDownListFor m   gt  m SelectedUserRoleId  Model UserRoles    References    LabelExtensions LabelFor SelectExtensions DropDownListFor   This will produce    lt label for  SelectedUserRoleId  gt User Role lt  label gt   lt select id  SelectedUserRoleId  name  SelectedUserRoleId  gt       lt option value  1  gt First Role lt  option gt       lt option value  2  gt Second Role lt  option gt       lt option value  3  gt Etc    lt  option gt   lt  select gt

User · Answer

List lt CategoryModel gt  CategoryList   CategoryModel GetCategoryList UserID           IEnumerable lt SelectListItem gt  CategorySelectList   CategoryList Select x   gt  new SelectListItem     Text   x CategoryName Trim    Value   x CategoryID Trim                  lt tr gt           lt td gt               lt B gt Assigned Category  lt  B gt           lt  td gt           lt td gt               Html DropDownList  CategoryList   CategorySelectList   Select a Category  Optional             lt  td gt       lt  tr gt

[c#] Populating a razor dropdownlist from a List<object> in MVC

Examples related to c#

Examples related to asp.net-mvc-4

Examples related to razor

Examples related to html.dropdownlistfor