Adding a custom HTML Helper to MVC Project

Question

I've been browsing the web trying to find a good example/tutorial detailing how I can create and use my own custom HTML Helpers for my MVC 3 Razor application I found this one which is as follows

Adding your own HtmlHelper in ASP.NET MVC 3

I've created a class (trimmed it down a bit) as so

using System;
using System.Collections.Generic;
using System.Globalization;
using System.Linq;
using System.Linq.Expressions;
using System.Web;
using System.Web.Mvc;
using System.Web.Mvc.Html;

namespace MyWebApp
{
    public static class ExtensionMethods
    {
         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"}

              };
              return html.DropDownListFor(expression, 
                       new SelectList(stateList, "key", "value"));
         }

     }
}

So far so good,

Inside my controller I also added the reference

using System.Web.Mvc.Html;

Now inside my view i have the following

@Html.StateDropDownList(x => x.State)

But I get the following error

System.web.mvc.htmlhelper<system.collections.generic.list<Profile.ProfileImages>> does     not contain a definition for StateDropDownList and no extension method     StateDropDownList acception a first argument of type     system.web.mvc.htmlhelper<System.Collections.Generic.List<Profile.ProfileImages>> could be      found(Are you missing a using directive of an assembly reference?)

Could someone please tell me what im doing wrong here.

@UfukHacıoğulları Sorry I added the incorrect error statement, I've updated the above. — Code Ratchet
– Code Ratchet, Commented Sep 21, 2013 at 20:20

Liam · Accepted Answer · 2015-10-28 09:45:12Z

16

You should include the namespace in your view:

@using MyWebApp

Or you can import this namespace for all of the views from web.config.

<system.web.webPages.razor>
  <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.Optimization" />
      <add namespace="System.Web.Routing" />
      <add namespace="MyWebApp" />
    </namespaces>
  </pages>
</system.web.webPages.razor>

edited Oct 28, 2015 at 9:45

Liam

30k28 gold badges143 silver badges206 bronze badges

answered Sep 21, 2013 at 20:16

Ufuk Hacıoğulları

38.6k14 gold badges120 silver badges157 bronze badges

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

Comments

Michael · Accepted Answer · 2014-03-03 06:25:47Z

3

I think an easier option would be to do the following: 1. Create a view as usual, place your helpers in that as usual with the mix of code and html as you like. 2. Move the view to the App_Code folder. 3. Get to your helps in all your views as so (Note that _MyHelpers is the name of the view in the App_Code folder):

@_MyHelpers.JQMRadioTrueFalse("Voice Mail on your Home Phone?", "HomePhoneHasAnswerPhone", Model.TrueFalse, t.HomePhoneHasAnswerPhone)

This would be an example of a view in the App_Code folder that is accessed on any view as above:

    @helper JQMRadioList(string Legend, string RadioListName, List<Fizz.DomainClasses.GenericClasses.GenericDropDownOption> options, bool Horizontal = false, string CurrentSelection = "")
    {
        <fieldset data-role="controlgroup" data-mini="true" data-theme="b" @((Horizontal) ? " data-type=\"horizontal\"" : "")>
            <legend>@Legend:</legend>
            @foreach (var li in options)
            {
                @JQMRadioListItem(RadioListName, li.TheValue, li.Text, CurrentSelection)
            }
        </fieldset>
    }

answered Mar 3, 2014 at 6:25

Michael

3112 silver badges12 bronze badges

2 Comments

Michael Over a year ago

Not sure who down voted this but could I ask what was the reason?

Greg Gum Over a year ago

This answer shows how to create a helper in a view. It is an alternative to code based views and there is no reason for the downvote.

Collectives™ on Stack Overflow

Adding a custom HTML Helper to MVC Project

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related