How to create Select List for Country and States/province in MVC

Question

Hi I am new to MVC and even asp..

I want to create a form in MVC. With the help of some examples I am able to create TextBoxes, but I now I don't understand how to create Select List./

I tried searching many examples for implementing Select List in MVC, but I am not able to understand.

I have a Form which is half coded in HTML and half in MVC.

Here is my Code:

using System; using System.Collections.Generic; using System.Linq; using System.Web;  namespace MedAvail.Applications.MedProvision.Web.Models {     public class AddressViewModel     {         public string Street1 { get; set; }         public string Street2 { get; set; }         public string City { get; set; }         public string Province { get; set; }         public string Country { get; set; }         public string PostalCode { get; set; }         public string PhoneNumber { get; set; }     } }     <form id="locationInfo">     <h1>Location Information</h1>     <table width="80%" id="locInfo">         <colgroup>             <col width="20%" />             <col />         </colgroup>         <tr>             <th>@Html.Label("Country")</th>             <td>                 <select required="">                     <option>Select Country</option>                     <option>Canada</option>                     <option>United States</option>                 </select>                 <span class="required">*</span>             </td>         </tr>         <tr>             <th>@Html.LabelFor(x=>x.State)</th>             <td>                 <select required="">                     <option>Select State</option>                     <option>State 1</option>                     <option>State 2</option>                     <option>State 3</option>                         ...............                 </select><span class="required">*</span></td>         </tr>         <tr>             <th>@Html.LabelFor(x=>x.PostalCode)</th>             <td>@Html.TextBoxFor(x=>x.PostalCode)<span class="required">*</span></td>         </tr>         <tr>             <th>@Html.LabelFor(x=>x.City)</th>             <td>@Html.TextBoxFor(x=>x.City)<span class="required">*</span></td>         </tr>          <tr>             <th>@Html.LabelFor(x=>x.StreetAddress1)</th>             <td>@Html.TextBoxFor(x=>x.StreetAddress1)<span class="required">*</span></td>         </tr>         <tr>             <th>@Html.LabelFor(x=>x.StreetAddress2)</th>             <td>@Html.TextBoxFor(x=>x.StreetAddress2)</td>         </tr>         <tr>             <th>@Html.LabelFor(x=>x.PhoneNumber)</th>             <td>@Html.TextBoxFor(x=>x.PhoneNumber)</td>         </tr>      </table>       <div role="button" class="marginTop50 marginBottom">         <input type="button" id="step3Back" value="Back" class="active" />         <input type="button" id="step3confirmNext" value="Next" class="active marginLeft50" />     </div> </form> 

Please guide me on how to create the Select List for this kind of form.

Answer 1

public static List<SelectListItem> States = new List<SelectListItem>()     {         new SelectListItem() {Text="Alabama", Value="AL"},         new SelectListItem() { Text="Alaska", Value="AK"},         new SelectListItem() { Text="Arizona", Value="AZ"},         new SelectListItem() { Text="Arkansas", Value="AR"},         new SelectListItem() { Text="California", Value="CA"},         new SelectListItem() { Text="Colorado", Value="CO"},         new SelectListItem() { Text="Connecticut", Value="CT"},         new SelectListItem() { Text="District of Columbia", Value="DC"},         new SelectListItem() { Text="Delaware", Value="DE"},         new SelectListItem() { Text="Florida", Value="FL"},         new SelectListItem() { Text="Georgia", Value="GA"},         new SelectListItem() { Text="Hawaii", Value="HI"},         new SelectListItem() { Text="Idaho", Value="ID"},         new SelectListItem() { Text="Illinois", Value="IL"},         new SelectListItem() { Text="Indiana", Value="IN"},         new SelectListItem() { Text="Iowa", Value="IA"},         new SelectListItem() { Text="Kansas", Value="KS"},         new SelectListItem() { Text="Kentucky", Value="KY"},         new SelectListItem() { Text="Louisiana", Value="LA"},         new SelectListItem() { Text="Maine", Value="ME"},         new SelectListItem() { Text="Maryland", Value="MD"},         new SelectListItem() { Text="Massachusetts", Value="MA"},         new SelectListItem() { Text="Michigan", Value="MI"},         new SelectListItem() { Text="Minnesota", Value="MN"},         new SelectListItem() { Text="Mississippi", Value="MS"},         new SelectListItem() { Text="Missouri", Value="MO"},         new SelectListItem() { Text="Montana", Value="MT"},         new SelectListItem() { Text="Nebraska", Value="NE"},         new SelectListItem() { Text="Nevada", Value="NV"},         new SelectListItem() { Text="New Hampshire", Value="NH"},         new SelectListItem() { Text="New Jersey", Value="NJ"},         new SelectListItem() { Text="New Mexico", Value="NM"},         new SelectListItem() { Text="New York", Value="NY"},         new SelectListItem() { Text="North Carolina", Value="NC"},         new SelectListItem() { Text="North Dakota", Value="ND"},         new SelectListItem() { Text="Ohio", Value="OH"},         new SelectListItem() { Text="Oklahoma", Value="OK"},         new SelectListItem() { Text="Oregon", Value="OR"},         new SelectListItem() { Text="Pennsylvania", Value="PA"},         new SelectListItem() { Text="Rhode Island", Value="RI"},         new SelectListItem() { Text="South Carolina", Value="SC"},         new SelectListItem() { Text="South Dakota", Value="SD"},         new SelectListItem() { Text="Tennessee", Value="TN"},         new SelectListItem() { Text="Texas", Value="TX"},         new SelectListItem() { Text="Utah", Value="UT"},         new SelectListItem() { Text="Vermont", Value="VT"},         new SelectListItem() { Text="Virginia", Value="VA"},         new SelectListItem() { Text="Washington", Value="WA"},         new SelectListItem() { Text="West Virginia", Value="WV"},         new SelectListItem() { Text="Wisconsin", Value="WI"},         new SelectListItem() { Text="Wyoming", Value="WY"}     }; 

How we do it is put this method into a class and then call the class from the view

@Html.DropDownListFor(x => x.State, Class.States) 

Answer 2

Thank You All! I am able to to load Select List as per MVC now My Working Code is below:

HTML+MVC Code in View:-

    <tr>         <th>@Html.Label("Country")</th>         <td>@Html.DropDownListFor(x =>x.Province,SelectListItemHelper.GetCountryList())<span class="required">*</span></td>     </tr>     <tr>         <th>@Html.LabelFor(x=>x.Province)</th>         <td>@Html.DropDownListFor(x =>x.Province,SelectListItemHelper.GetProvincesList())<span class="required">*</span></td>     </tr> 

Created a Controller under "UTIL" folder: Code:-

using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc;  namespace MedAvail.Applications.MedProvision.Web.Util {     public class SelectListItemHelper     {         public static IEnumerable<SelectListItem> GetProvincesList()         {             IList<SelectListItem> items = new List<SelectListItem>             {                 new SelectListItem{Text = "California", Value = "B"},                 new SelectListItem{Text = "Alaska", Value = "B"},                 new SelectListItem{Text = "Illinois", Value = "B"},                 new SelectListItem{Text = "Texas", Value = "B"},                 new SelectListItem{Text = "Washington", Value = "B"}              };             return items;         }           public static IEnumerable<SelectListItem> GetCountryList()         {             IList<SelectListItem> items = new List<SelectListItem>             {                 new SelectListItem{Text = "United States", Value = "B"},                 new SelectListItem{Text = "Canada", Value = "B"},                 new SelectListItem{Text = "United Kingdom", Value = "B"},                 new SelectListItem{Text = "Texas", Value = "B"},                 new SelectListItem{Text = "Washington", Value = "B"}              };             return items;         }       } } 

And its working COOL now :-)

Thank you!!