Asp.Net MVC HTML Helper Methods

Here we will learn what are the html helpers in mvc, why we need html helpers in mvc, how to use html helpers in mvc application with example and difference between webform controls and mvc controls rendering with example.

HTML Helpers in Asp.Net MVC

Let's understand what are the HTML helpers in mvc and later we will study how to create it.


         - We use HTML helpers in a view to render HTML content in mvc


         - An HTML helper is just a method that returns a string. 


One of the basic thing of any web application is to render html as output. In .NET we have ASP.NET Webforms and ASP.NET MVC framework both will render html very well but they do this thing in different ways. 


  • In ASP.NET Webforms we just drag and drop control on Form and in code behind .cs page we just bind data to it and it starts displaying data. In webforms server controls are used to generate HTML.
  • In ASP.NET MVC we don't have any server controls. In mvc we have only HTML controls check the tool box you will find all sort of HTML controls there. In mvc HTML helpers will help us to render html in browser.

If you have come from ASP.NET webforms development background then you will think ASP.NET Webforms is better as compare to ASP.NET MVC because here you need to write bulk of HTML that will get render in browser and writing whole html will make developers bit crazy. For that ASP.NET MVC came up with HTML Helpers which will help you to render html in browser. 


The HTML helpers and server controls are the same and both are used to render html on browser but if we use HTML helpers we don't need viewstate to maintain its state but server controls will use viewstate to maintain state and data.


Following are the list of html helper methods available in mvc


  1.     @Html.BeginForm
  2.     @Html.EndForm
  3.     @Html.TextBox
  4.     @Html.TextArea
  5.     @Html.Password
  6.     @Html.Hidden
  7.     @Html.CheckBox
  8.     @Html.RadioButton
  9.     @Html.DropDownList
  10.     @Html.ListBox

 Let’s take example of both webform controls and mvc controls


In webforms hyperlink button control code will be like as shown below


<asp:HyperLink ID="HyperLink1" runat="server">Login</asp:HyperLink>

 For above webforms hyperlink button how browser will render? that would be like as shown below


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">

<html xmlns="">

<head> </head>


<form id="Form2" action="login.aspx" method="post">

<a id="A1" href="Login.aspx">Login</a>



 In mvc link button of HTML helper will be like as shown below 



For above mvc link button how browser will render? that would be like as shown below 


<!DOCTYPE html>



<meta charset="utf-8"/>

<meta name="viewport" content="width=device-width"/>


<link href="/Content/site.css" rel="stylesheet"/>

<script src="/Scripts/modernizr-2.5.3.js"></script>




<form action="/PersonDetails/index" method="post">





<script src="/Scripts/jquery-1.7.1.js"></script>

<script src="/Scripts/jquery.unobtrusive-ajax.js"></script>

<script src="/Scripts/jquery.validate.js"></script>

<script src="/Scripts/jquery.validate.unobtrusive.js"></script>



 If we use html helper method in mvc that will help developers to write html automatically.