ASP.NET MVC HTML helper

May 12, 2021 ASP.NET

1. ASP.NET MVC - HTML Helper

2. HTML helper

3. Standard HTML helper

4. HTML links

5. HTML form elements

6. Related tutorials

ASP.NET MVC - HTML Helper

ASP.NET MVC framework includes helper methods that make it easy to render HTML in the view.

The HTML helper is used to modify the HTML output.

HTML helper

With MVC, html helpers are similar to traditional ASP.NET web Form controls.

Like ASP.NET form controls in the web, HTML helpers are used to modify HTML. B ut HTML helpers are lightweight. Unlike Web Form controls, HTML Helper does not have event models and view states.

In most cases, the HTML helper is simply a way to return a string.

With MVC, you can create your own helper or use the built-in HTML helper directly.

Standard HTML helper

MVC contains standard helpers for most commonly used HTML element types, such as HTML links and HTML form elements.

HTML links

The easiest way to render HTML links is to use HTML. ActionLink() helper.

With MVC, Html.ActionLink() is not connected to the view. It creates a connection to the controller operation.

Razor syntax:

@Html.ActionLink("About this Website", "About")

ASP syntax:

<%=Html.ActionLink("About this Website", "About")%>

The first argument is the linked text, and the second argument is the name of the controller operation.

The Html.ActionLink() helper above outputs the following HTML:

<a href="/Home/About">About this Website</a>

Some properties of the Html.ActionLink() helper:

Attributes	describe
.linkText	URL text (label), internal text of the positioning point element.
.actionName	The name of the operation (Action).
.routeValues	The value transmitted to the action is an object that contains routing parameters.
.controllerName	The name of the controller.
.htmlAttributes	The properties of the URL are an object that contains the HTML feature set for this element.
.protocol	URL protocol, such as "http" or "https".
.hostname	The host name of the URL.
.fragment	URL fragment name (positioning point name).

Note: You can pass values to controller actions. For example, you can pass the id of a database record to a database Edit operation:

Razor Syntax C#:

@Html.ActionLink("Edit Record", "Edit", new {Id=3})

Razor syntax VB:

@Html.ActionLink("Edit Record", "Edit", New With{.Id=3})

The Html.ActionLink() helper above outputs the following HTML:

<a href="/Home/Edit/3">Edit Record</a>

HTML form elements

The following HTML helpers can be used to render (modify and output) HTML form elements:

BeginForm()
EndForm()
TextArea()
TextBox()
CheckBox()
RadioButton()
ListBox()
DropDownList()
Hidden()
Password()

ASP.NET Syntax C#:

<%= Html.ValidationSummary("Create was unsuccessful. Please correct the errors and try again.") %>
<% using (Html.BeginForm()){%>

<label for="FirstName">First Name:</label>
<%= Html.TextBox("FirstName") %>
<%= Html.ValidationMessage("FirstName", "*") %>


<label for="LastName">Last Name:</label>
<%= Html.TextBox("LastName") %>
<%= Html.ValidationMessage("LastName", "*") %>


<label for="Password">Password:</label>
<%= Html.Password("Password") %>
<%= Html.ValidationMessage("Password", "*") %>


<label for="Password">Confirm Password:</label>
<%= Html.Password("ConfirmPassword") %>
<%= Html.ValidationMessage("ConfirmPassword", "*") %>


<label for="Profile">Profile:</label>
<%= Html.TextArea("Profile", new {cols=60, rows=10})%>


<%= Html.CheckBox("ReceiveNewsletter") %>
<label for="ReceiveNewsletter" style="display:inline">Receive Newsletter?</label>


<input type="submit" value="Register" />

<%}%>

That's ASP.NET MVC HTML helper for the 1000s.

ASP.NET MVC HTML helper

Table of contents

ASP.NET MVC - HTML Helper

HTML helper

Standard HTML helper

HTML links

HTML form elements

Related tutorials

Cookie Consent