Adding Native HtmlHelper to ASP.NET MVC 3

Question

I am new to MVC and I am trying to create my own extension method to add to the html helpers available in my razor views. Html.DropDownListFor() allows you to create a drop-down list for any purpose of your model. I would like to create an assistant called Html.StateDropDownListFor() that does the same, except that it unloads all 50 US states. This way, I don't need to create a SelectList for every single state that I create. What is the easiest way to do this? Right now I have this:

 public static class ExtensionMethods { public static MvcHtmlString StateDropDownList(this HtmlHelper html) { // ??? } } 

Am I even close? I don’t want to rebuild the whole textbox helper, I just want to create a helper that uses the existing textbox helper, but selects SelectList for me. So, in my views, I could just do Html.StateDropDownList(x => x.State)

Your answers are greatly appreciated.

Here is the answer!

You guys are great help, thanks! Here is a complete extension method in case anyone else uses it.

  public static MvcHtmlString StateDropDownListFor<TModel, TValue>(this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression) { Dictionary<string, string> stateList = new Dictionary<string, string>() { {"AL"," Alabama"}, {"AK"," Alaska"}, {"AZ"," Arizona"}, {"AR"," Arkansas"}, {"CA"," California"}, {"CO"," Colorado"}, {"CT"," Connecticut"}, {"DE"," Delaware"}, {"FL"," Florida"}, {"GA"," Georgia"}, {"HI"," Hawaii"}, {"ID"," Idaho"}, {"IL"," Illinois"}, {"IN"," Indiana"}, {"IA"," Iowa"}, {"KS"," Kansas"}, {"KY"," Kentucky"}, {"LA"," Louisiana"}, {"ME"," Maine"}, {"MD"," Maryland"}, {"MA"," Massachusetts"}, {"MI"," Michigan"}, {"MN"," Minnesota"}, {"MS"," Mississippi"}, {"MO"," Missouri"}, {"MT"," Montana"}, {"NE"," Nebraska"}, {"NV"," Nevada"}, {"NH"," New Hampshire"}, {"NJ"," New Jersey"}, {"NM"," New Mexico"}, {"NY"," New York"}, {"NC"," North Carolina"}, {"ND"," North Dakota"}, {"OH"," Ohio"}, {"OK"," Oklahoma"}, {"OR"," Oregon"}, {"PA"," Pennsylvania"}, {"RI"," Rhode Island"}, {"SC"," South Carolina"}, {"SD"," South Dakota"}, {"TN"," Tennessee"}, {"TX"," Texas"}, {"UT"," Utah"}, {"VT"," Vermont"}, {"VA"," Virginia"}, {"WA"," Washington"}, {"WV"," West Virginia"}, {"WI"," Wisconsin"}, {"WY"," Wyoming"}, {"AS"," American Samoa"}, {"DC"," District of Columbia"}, {"FM"," Federated States of Micronesia"}, {"MH"," Marshall Islands"}, {"MP"," Northern Mariana Islands"}, {"PW"," Palau"}, {"PR"," Puerto Rico"}, {"VI"," Virgin Islands"}, {"GU"," Guam"} }; return html.DropDownListFor(expression, new SelectList(stateList, "key", "value")); } 

I modified the above code to use the dictionary for state abbreviations.

Just remember to point System.Web.Mvc.Html at the top of your class of extension methods, as I forgot, d'oh!

Answer 1

To use a custom helper method in Razor views, you will need to enter it into the volume. There are two ways to do this:

• Add @using SomeNamespace at the top of your view with a namespace that indicates the static class containing the helper element

• In ~/Views/web.config add:

   <system.web.webPages.razor> <host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=3.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" /> <pages pageBaseType="System.Web.Mvc.WebViewPage"> <namespaces> <add namespace="System.Web.Mvc" /> <add namespace="System.Web.Mvc.Ajax" /> <add namespace="System.Web.Mvc.Html" /> <add namespace="System.Web.Routing" /> <add namespace="SomeNamspace" /> </namespaces> </pages> </system.web.webPages.razor> 

Once the user assistant falls into scope, Intellisense should be able to select it, and you can use it:

 @Html.StateDropDownList() 

Now the helper method should do something useful for you. You can call existing helpers:

 public static class ExtensionMethods { public static MvcHtmlString StateDropDownList(this HtmlHelper html) { return html.TextBox("foo") } } 

or return some user data:

 public static class ExtensionMethods { public static MvcHtmlString StateDropDownList(this HtmlHelper html) { return MvcHtmlString.Create("Hello world"); } } 

If you have a strongly typed view and you want to use the expression:

 using System.Web.Mvc; using System.Web.Mvc.Html; public static class ExtensionMethods { public static MvcHtmlString StateDropDownList( this HtmlHelper<MyViewModel> html ) { var stateList = new SelectList(new[] { new { Key = "Alabama", Value = "Alabama" }, new { Key = "Idaho", Value = "Idaho" }, new { Key = "California", Value = "California" } }, "Key", "Value"); return Html.DropDownListFor( x => x.State, stateList, "-- Select a state --" ); } } 

and then:

 @Html.StateDropDownList() 

Answer 2

 using System.Web.Mvc.Html; public static MvcHtmlString StateDropDownList<TModel, TValue>( this HtmlHelper<TModel> html, Expression<Func<TModel, TValue>> expression ) { return html.DropDownListFor( expression, _stateList ); } 

Will work. _stateList is an IEnumerable<SelectListItem> .