Adding your own HtmlHelper in ASP.NET MVC 3

Question

I am new to MVC and I am trying to create my own extension method so that I can add onto the html helpers that are available in my razor views. Html.DropDownListFor() lets you create a drop down list for any propery on your model. I would like to create a helper called Html.StateDropDownListFor() that does the exact same thing, except loads the drop down with all 50 US states. This way I don't have to create a SelectList for every single state drop down 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 a whole text box helper, I just want to create a helper that utilizes the existing text box helper but does the SelectList for me. That way in my views I could just do Html.StateDropDownList(x => x.State)

Answer 1

To use the custom helper method in your Razor views you will need to bring it into scope. There are two possible ways to do this:

1. Add a @using SomeNamespace in the top of your view with the namespace where the static class containing the helper is defined

2. 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 custom helper is brought into scope in the view, Intellisense should be able to pick it and you could use it:

@Html.StateDropDownList() 

Now you helper method needs to do something useful. You could either call existing helpers:

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

or return some custom 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 wanted to use an 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 ); } 

Would work. _stateList being an IEnumerable<SelectListItem>.