Custom HTML Helper methods in ASP.NET MVC 4
In this article, we will look into different approaches available for creating custom Helper methods within ASP.NET MVC 4 application. An HTML Helper is just a method that returns a string having HTML or plain text and can be used in our Views. We have built-in Helpers like Html.ActionLink(),Html.CheckBox() etc. Let’s create our own Helper method. Create a new Internet MVC 4 application and name it as MyCustomHelper.
We will create a Helper method to strip\remove the HTML tags from a string. Modify the Index view with code as shown below:
@{ ViewBag.Title = "Home Page"; } @helper StripHTML(string input) { <b> @System.Text.RegularExpressions.Regex.Replace(input, "<.*?>", string.Empty) </b> } <div> HTML Content: @HttpUtility.HtmlDecode("<div><p>Test</p><br/></div>") <br /> Plain Content:@StripHTML("<div><p>Test</p></div>") </div>
Above Helper will strip the HTML from any parameter passed to it and renders on the View. Syntax is for defining a helper is similar to defining a Method without return type. This way, we can create Helper method with our logic & markup needed. One problem here is, we can't reuse it in other Views. To solve this, we can move the Index.cshtml having custom Helper to App_code folder [Create it, if not exist] and access the helper in any View by mentioning ViewName.HelperName as shown in below code:
@Index.StripHTML("<div><p>Test</p></div>")
Another approach to create custom HTML helper is using Extension methods. Add a new class named MyHelper.cs with below code:
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; namespace MyCustomHelper.Helpers { public static class MyHelper { public static MvcHtmlString StripHTML(this HtmlHelper html, string input) { return new MvcHtmlString(System.Text.RegularExpressions.Regex.Replace(input, "<.*?>", string.Empty)); } } }
Build the project and include below code in the view, where you need to access the Helper Method as shown below:
@using MyCustomHelper.Helpers @Html.StripHTML("<div><p>Test</p></div>")
I am attaching source code for reference. By following above two approaches, we can create our own HTML helpers for using in the Views. I hope this article will be helpful for all.