Custom Helpers in Asp.net MVC4

This tip explaining how to create custom helpers in asp.net MVC4 step by step clearly. It will be very helpful for who want to learn asp.net MVC as beginners.

What are HTML Helpers in ASP.NET MVC?

Html Helpers are nothing but way of rendering HTML on the view page in ASP.NET MVC. In other words simply it is just a method which returns you a string , and string is HTML.

Example of HTML Helpers:
Here I am showing some of the example in html helpers

//
// static class
//
@Html.TextBoxFor(model=>model.Lastname)

<span style="font-size: 9pt;">@Html.LabelFor(model=>model.Firstname)

@Html.</span>ActionLink<span style="font-size: 9pt;">("Link name","Methodname","ControllerName")...e.t.c</span>

Why to use Html Helpers? 
We can use directly HTML tags and we have another oppurtunity to achieve same thing using HTML Helpers. It just for making developer's life more easy and to have the cleaner html for your view page. And Helpers are strongly binded to your model.
Why we Need of Custom Html Helpers?
For every frame work we need to do some customization on top of every frame work. because of the existing things not fulfill in your Business Requirement. In that case you need to write some custom stuff. Writing a custom Html helper is nothing but writing an extension method  for HtmlHelper class. HtmlHelper class is the root for the helpers. I hope every body know about extension methods in c#.

Using the code

Ho to Create Custom Html Helper?
Here I will simply write an Html helper which will render the container of any content on view page.
This is done simply by using the <div> tag of Html .
Step1:
Create one custom static class for creation of your custom Html helpers

//
// static class
//
public static class CustomHelpers
{

}

Step2:
Add static method to the class and make sure that return type is MvcHtmlString

//
// static method 
//

public static MvcHtmlString Div(this HtmlHelper helper, string content)
{

}

Step3:
Add the rendering logic in the method , you can take help from TagBuilder class to generate Html tags to be rendered.

//
// Logic for rendering
//
public static MvcHtmlString Div(this HtmlHelper helper, string content)
{
var tagBuilder = new TagBuilder("Div");
tagBuilder.InnerHtml = content;
return new MvcHtmlString(tagBuilder.ToString());
}

 Step4:
Build the project.
open any view i.e., .cshtml file and add custom class name space to that view
here I have created my custom class was under model folder.
@using CustomHelpersExample.Models
Finally call the method in view

//
// finally method call in view
//

@Html.Div("<input type='text' id='txtUsername' placeholder='Username'/></br></br><input type='password' 
placeHolder='Password' id='txtpassword'/></br></br><input type='Submit' value='Login'></submit>")

thats it now run your project.
then finally in browser the code rendered as

//
// finally after rendering the code below
//

<div>
<input type="text" id="txtUsername" placeholder="Username"><br />
<input type="password" id="txtpassword" placeholder="Password"><br />
<input type="submit" value="Login">
</div>

Thats it.