ASP.NET HTML Server Controls

HTML server controls are HTML elements that contain attributes to accessible at server side. By default, HTML elements on an ASP.NET Web page are not available to the server. These components are treated as simple text and pass through to the browser. We can convert an HTML element to server control by adding a runat="server" and an id attribute to the component.

Now, we can easily access it at code behind.

Example

All the HTML Server controls can be accessed through the Request object.

HTML Components

The following table contains commonly used HTML components.

Controls Name	Description
Button	It is used to create HTML button.
Reset Button	It is used to reset all HTML form elements.
Submit Button	It is used to submit form data to the server.
Text Field	It is used to create text input.
Text Area	It is used to create a text area in the html form.
File	It is used to create a input type = "file" component which is used to upload file to the server.
Password	It is a password field which is used to get password from the user.
CheckBox	It creates a check box that user can select or clear.
Radio Button	A radio field which is used to get user choice.
Table	It allows us to present information in a tabular format.
Image	It displays an image on an HTML form
ListBox	It displays a list of items to the user. You can set the size from two or more to specify how many items you wish to show.
Dropdown	It displays a list of items to the user in a dropdown list.
Horizontal Rule	It displays a horizontal line across the HTML page.

Example

Here, we are implementing an HTML server control in the form.

// htmlcontrolsexample.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="htmlcontrolsexample.aspx.cs" 
Inherits="asp.netexample.htmlcontrolsexample" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<input id="Text1" type="text" runat="server"/>
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click"/>
</div>
</form>
</body>
</html>

This application contains a code behind file.

// htmlcontrolsexample.aspx.cs

using System;
namespace asp.netexample
{
public partial class htmlcontrolsexample : System.Web.UI.Page
    {
protected void Page_Load(object sender, EventArgs e)
        {
        }
protected void Button1_Click(object sender, EventArgs e)
        {
string a = Request.Form["Text1"];
            Response.Write(a);
        }
    }
}

Output: