HTML controls have a one-to-one mapping with HTML tags. To use an HTML control in a Web Form, you declare it using the standard HTML tag that represents the control in HTML. However, the tag will have one attribute that must be present to indicate that this control is a server control:
runat attribute will have the value server. As one example, the following is an input text control.
<input type="text" id="userName" runat="server">
In the .NET Framework type library, HTML controls reside in the
System.Web.UI.HtmlControls namespace, and all controls derive directly and indirectly from the HtmlControl abstract class. HTML controls are grouped into three categories:
Input controls. All input controls are derived from the abstract class
HtmlInputControl, which itself is an extension of
HtmlControl. Child classes of
Container controls. These controls are extended from the
HtmlTextAreaare container controls derived from
What are your experiences with Web form development with C# or even other programming languages?
Post your comments
Image control. There is only one class in this category: HtmlImage. You can guess from the control name what HTML tag each control maps to; for example, HtmlAnchor maps to the tag, HtmlForm maps to
Web controls exist within the
System.Web.UI.WebControls namespace and derive directly or indirectly from the
WebControl base class. Some of the controls are very simple controls that are identical to HTML controls. Some others, however, provide higher-level abstractions.
Web controls are declared using the
asp prefix. For example, the following is a
TextBox Web control declaration.
<asp:TextBox id="userName" type="text" runat="server">
The above Web control is rendered as the following.
<input name="userName" type="text" id="userName" type="text" />
which is the same as the HTML tag sent by the following HTML input text control.
<input type=text id="userName" runat="server">
Note that a Web control must be written using the XML syntax, whereas an HTML control can use either the HTML or XML syntax.
However, you can't interchange a Web control with its HTML control equivalent without changing the code, because a Web control in an ASP.NET page will be translated into a different object. For example, to retrieve the value entered by the user to a
TextBox Web control, you would use the
Text property of the
TextBox object, whereas to do the same task with an
HtmlInputText control you use the
Even though HTML controls present similarity that makes code migration from ASP to ASP.NET easier, Web controls have some superior features that don't exist in the former. These features include the following:
Web controls provide a rich and consistent object model. The richness is partly attributed to the parent base classes
WebControl. This class includes properties such as
Height, etc. Because all Web controls are child classes of
WebControl, all Web controls inherit these properties as well, making programming easier.
Web controls automatically detect the capabilities of the client browser and customize their rendering to make best use of these capabilities. For example, the following
Labelcontrol is rendered differently in version 3.0 of Navigator and Internet Explorer and version 4.0 and above of each browser.
<asp:Label runat="server" Text="Label Control" Font-Italic="true" />
Using IE 5.5, the Label control is rendered as the following HTML code.
<span style="font-style:italic;">Label Control</span>
Using Navigator 3.0, on the hand, gives you the following HTML code.
Any property of a Web control can be data-bound. In addition, there are several Web controls that can be used to render the contents of a data source. Some of the controls are indeed very rich. For instance, the
CalendarWeb control can be used to allow navigating between dates and make date selection, including date ranges. The following one line declaration results in the calendar control shown in Figure 2.
<asp:Calendar runat=server /<
Both types of server controls can raise events that will be run during the event handling stage of the Page class. For instance, the
HtmlInputButton control has the
ServerClick event that is raised when the control is clicked on the browser. Another example is the
ImageButton control that has the
Click event. This event occurs when the control is clicked by the user.
In Web Forms, directives are optional settings that the author of a Web Forms page uses to instruct the page compiler to follow some compilation commands. Page directives can be located anywhere within an
.aspx file. Each directive can contain one or more attribute/value pairs specific to that directive.
The following is the list of directives in Web Forms.
The @ Page Directive
The @ Page directive defines page-specific attributes used by the ASP.NET page parser and compiler. You can only have one @ Page directive for every
.aspx file. It has 17 attributes and the most important ones are listed below.
Buffer-- Defines HTTP response buffering semantics. In general, buffering makes your code faster by holding the response until all processing is finished and sending the output in one go. This attribute is true by default.
ContentType-- Defines the HTTP content type of the response as a standard MIME type. Supports any valid HTTP content type string.
EnableSessionState-- Defines session state requirements for the page. True if session state is enabled;
ReadOnlyif session state can be read but not changed; otherwise false. The default is true.
ErrorPage-- Defines target URL for redirection if an un-handled page exception occurs.
Inherits-- Code-behind class for page to inherit. Can be any class derived from the Page Class.
Language-- Language used when compiling all
<%= %>blocks within the page. Can be Visual Basic, C#, or Jscript.NET.
MaintainState-- Indicates whether view state should be maintained across page requests. True if view state should be maintained; otherwise false. The default is true.
SRC-- Code-behind class to compile. (Source file name)
Trace-- Indicates whether tracing is enabled. True if trace is enabled; otherwise false. The default is false.
Transaction-- Indicates whether transactions are supported on the page. Possible values are:
Warnings-- Indicates whether compiler warnings are treated as errors. True if warnings should be treated as errors; otherwise false. The default is false.
For example, the following is an @ Page directive that tells the compiler that the language used in the
.aspx page is C#, and that the class should be compiled into a new class that inherits the
MyCode class that can be found in the
<%@ Page language="c#" Src="MyCode.cs" Inherits="MyCode" %>
The @ Control Directive
The @ Control directive defines user control-specific attributes used by the ASP.NET page parser and compiler. This directive can only be used with user controls.
The @ Import Directive
The @ Import directive explicitly imports a namespace into a page, making all classes and interfaces of the imported namespace available to the page. The imported namespace can be either part of the .NET Framework class library or a user-defined namespace. The @ Import directive cannot have more than one namespace attribute. To import multiple namespaces, you have to use multiple @ Import directives. Some most frequently used namespaces are imported automatically. These include
The @ Register Directive
The @ Register directive associates aliases with namespaces and class names for concise notation in custom server control syntax. For example, the following uses the @ Register directive to declare
tagname aliases for a server control and a user control.
The first directive declares the
MyTag alias as a tag prefix for all controls residing in the
MyCompany:MyNameSpace namespace. The second directive declares
Acme:AdRotator as a
tagprefix:tagname pair for the user control in the file
adrotator.ascx. The aliases are then used in custom server control syntax within the form to insert an instance of each server control.
<%@ Register Tagprefix="MyTag" Namespace="MyCompany:MyNameSpace" %>
<%@ Register Tagprefix="Acme" Tagname="AdRotator" Src="AdRotator.ascx" %>