Beginners Course of HTML Helper in ASP.NET MVC

In this tutorial, you will learn:
1. What is HTML Helper Class in ASP.NET MVC?
2. What is the difference between HTML Helper Class and simple HTML Controls?
3. How to bind HTML Helper Control to a models

What is HTML Helper Class in ASP.NET MVC?

As you know already that MVC doesn't use Server Control and instead it uses plain HTML Control. The benefit of using plain HTML control is; it loads faster and easily readable. However, plain HTML controls don’t get strongly bounded with models and in this situation, HTML Helper class helps a lot.

HTML Helper Class have set of methods that later converted into plain HTML Controls. The benefit of using HTML Helper class is that the HTML controls get rendered correctly and checked at compile time. So, if there is any problem with control, it can be corrected before running the final project.

Example: Standard HTML Helper
The HTML Helper @Html.TextBox("Textbox1", "val")  will render the following html control.
Output: <input id="Textbox1" name="Textbox1" type="text" value="val" />

However, it is not strongly bounded with models and generate plain HTML text box. For strongly type HTML control, we will use the following method.

Strongly Typed HTML Helper
@Html.TextBoxFor(m=>m.Name) 
Output: <input id="Name" name="Name" type="text" value="Name-val" />

This textbox is strongly bounded with Name properties of models m.

This is just a demo that shows you the structure of HTML Helper class. In the next few chapters, you will study all the method of HTML Helper class with complete programming example.

 

Here, is the list of HTML Helper Method

Html.Label
Html.LabelForModel
Html.TextBox
Html.TextArea

Html.CheckBox
Html.RadioButton
Html.DropDownList
Html.ListBox
Html.Hidden
Html.Password

Html.Display
Html.DisplayForModel
Html.DisplayName

Html.BeginForm
Html.BeginRouteForm
Html.EndForm

Html.Id
Html.IdForModel
Html.Name
Html.NameForModel
Html.Value
Html.ValueForModel
Html.Editor
Html.EditorForModel

Html.Action
Html.ActionLink
Html.RouteLink
Html.Partial
Html.RenderPartial
Html.RenderAction

Html.Validate
Html.ValidationMessage
Html.ValidationSummary
Html.Encode
URL Helpers

Summary:

This is a very basic chapter, which only introduces you to HTML Helper Class. In the next few chapters, you will learn how to use different types of HTML Helper method with programming example.

 

Share your thought