Skip to main content

ASP.NET MVC HTML Helpers


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

Popular posts from this blog

Collections in C#

Collections in C# In our previous article , we have learned about how we can use arrays in C#. Arrays in programming are used to group a set of related objects. So one could create an array or a set of Integers, which could be accessed via one variable name. What is Collections in C#? Collections are similar to Arrays, it provides a more flexible way of working with a group of objects. In arrays, you would have noticed that you need to define the number of elements in an array beforehand. This had to be done when the array was declared. But in a collection, you don't need to define the size of the collection beforehand. You can add elements or even remove elements from the collection at any point of time. This article will focus on how we can work with the different collections available in C#. There are three distinct collection types in C#: standard generic concurrent The standard collections are found under the System.Collections. They do not store elemen...

The String.Join Method in C# Explained

The String.Join Method in C#   The string.Join concatenates the elements of a specified array or the members of a collection, using the specified separator between each element or member. Overloads of string.Join Method Description Join(Char, Object[]) Concatenates the string representations of an array of objects, using the specified separator between each member. Join(Char, String[]) Concatenates an array of strings, using the specified separator between each member. Join(String, IEnumerable<String>) Concatenates the members of a constructed IEnumerable<T> collection of type String, using the specified separator between each member. Join(String, Object[]) Concatenates the elements of an object array, using the specified separator between each element. Join(String, String[]) Concatenates all the elements of a string array, usi...

System.IO Namesapce in C#

  System.IO Namesapce in C# A  file  is a collection of data stored in a disk with a specific name and a directory path. When a file is opened for reading or writing, it becomes a  stream . The stream is basically the sequence of bytes passing through the communication path. There are two main streams: the  input stream  and the  output stream . The  input stream  is used for reading data from file (read operation) and the  output stream  is used for writing into the file (write operation). From the above definition of file, the C# provides a namespace that enable us to manipulate file in C# called System.IO.   System.IO  is a  namespace  and it contains a standard IO (input/output) types such as classes , structures , enumerations , and  delegates  to perform a read/write operations on different sources like file, memory, network, etc.   System.IO Classes The table below shows differen...