ASP.NET MVC HTML Helpers
What are Html Helpers?
An HTML Helper is simply a method that returns a HTML string.
The string can represent any type of content that you want. For example, you
can use HTML Helpers to render standard HTML tags like HTML <input>,
<button> and <img> tags etc.
Helper class can create HTML controls
programmatically. HTML Helpers are used in View to render HTML content. It
is not mandatory to use HTML Helper classes for building an ASP.NET MVC
application, but HTML Helpers helps in the rapid development of a view.
You can also create your own
HTML Helpers to render more complex content such as a menu strip or an HTML
table for displaying database data.
Categories of HTML
Helpers?
1. Built-in HTML Helpers
2. Inline HTML Helpers
3. Custom HTML Helpers
Built-in HTML Helpers are also categorized into three, these are;
a. Standard HTML Helpers
b. Strongly typed HTML Helpers
c. Templated HTML Helpers
Standard HTML Helpers
Standard HTML Helpers are used to render the most common type of HTML
controls like TextBox, DropDown, Radio buttons, Checkbox etc. Extension methods
of HTML Helper classes have several overloaded versions. We can use any one
according to our requirement. Let’s see some of the Standard HTML Helpers:
Form
This HTML Helper is used for creating form element, BeginForm and
EndForm extension methods are mostly used for HTML form rendering.
From the above image, we can see that the form helper
syntax as @HTML.BeginForm() with some arguments such as action method (Create),
Controller (Documents), Form method (POST). It is enclosed in the using statement because it implements IDisposable
interface.
Label
The Label method of
HTML helper can be used for generating label element. Label extension method
have 6 overloaded versions.
TextBox
The TextBox Helper method renders a textbox in View that has a
specified name. We can also add attributes like class, placeholder etc. with
the help of overloaded method in which we have to pass objects of HTML
Attributes.
DropDownList
The DropDownList helper
renders a drop down list.
Strongly Typed HTML Helpers
Strongly
typed helpers are helpers that require lambda expression and strongly typed
views as we can see below. Just like Standard Helper, we have several strongly
typed methods.
Html.TextBoxFor(),
Html.TextAreaFor(), Html.DropDownListFor(), Html.CheckboxFor(),
Html.RadioButtonFor(), Html.ListBoxFor(), Html.PasswordFor(), Html.HiddenFor(),
Html.LabelFor(), etc.
Template HTML Helpers
These methods are very flexible and generate the HTML element based on
the properties of the model class.
The example
of these helpers can be seen in the application we built in our previous
articles where we scaffold our controller thereby creating action methods and
views for us as can be seen below.
Inline HTML Helpers
These are create in the same view by using the Razor @helper tag.
These helpers can be reused only on the same view. This is as shown
below
Custom HTML Helpers
You can also create your own custom helper
methods by creating an extension method on the HtmlHelper class or by creating
static methods with in a utility class as shown below
Thank you
Comments
Post a Comment