Build Your Own ASP.NET Website Using C# and VB.NET. Pt. 4. | WebReference

Build Your Own ASP.NET Website Using C# and VB.NET. Pt. 4.

Build Your Own ASP.NET Website Using C# and VB.NET. Pt. 4.

Reproduced from "Build Your Own ASP.NET Website Using C# & VB.NET" by permission of SitePoint. ISBN 0-9579218-6-1 , copyright 2004. All rights reserved. See https://www.sitepoint.com/ for more information.

Table of Contents

Working with HTML Controls
HtmlAnchor
HtmlButton
HtmlForm
HtmlImage
HtmlGenericControl
HtmlInputButton
HtmlInputCheckBox
HtmlInputFile
HtmlInputHidden
HtmlInputImage
HtmlInputRadioButton
HtmlInputText
HtmlSelect
HtmlTable, HtmlTableRow and HtmlTableCell
HtmlTextArea
Processing a Simple Form
Introduction to Web Forms
Introduction to Web Controls
Basic Web Controls
Handling Page Navigation
Using The HyperLink Control
Navigation Objects And Their Methods
Postback
Formatting Controls with CSS
Types of Styles and Style Sheets
Style Properties
The CssClass Property
A Navigation Menu and Web Form for the Intranet Application
Introducing the Dorknozzle Intranet Application
Building the Navigation Menu
Create the Corporate Style Sheet
Design the Web Form for the Helpdesk Application
Summary

At the heart of ASP.NET is its ability to create dynamic form content. Whether you’re creating a complex shopping cart application, or a simple page to collect user information and send the results out via email, Web Forms have a solution. They allow you to use HTML controls and Web controls to create dynamic pages with which users can interact. In this chapter, you will learn how Web Forms, HTML controls, and Web controls, in conjunction with VB.NET and C# code, should change the way you look at, and develop for, the Web. In this chapter I’ll introduce you to the following concepts:

  • HTML controls

  • Web Forms

  • Web controls

  • Handling page navigation

  • Formatting controls with CSS

Toward the end of the chapter, you’ll put all of these concepts to work into a real world application! I’ll introduce the Dorknozzle Intranet Application that you’ll be building throughout this book, and see how what you learned in this chapter can be applied to some of the pages for the project.

HTML controls are outwardly identical to plain old HTML 4.0 tags, but employ the runat="server" attribute. For each of HTML’s most common tags, a corresponding server-side HTML control exists, although Microsoft has added a few tags and some extra properties for each. Creating HTML controls is easy—we simply stick a runat="server" attribute on the end of a normal HTML tag to create the HTML control version of that tag. The complete list of current HTML control classes and their associated tags is given in Table 4.1.

These HTML control classes are all contained within the System.Web.UI.HtmlControls namespace.

Because HTML controls are processed on the server side by the ASP.NET runtime, we can easily access their properties through code elsewhere in the page. If you’re familiar with JavaScript, HTML, and CSS, then you’ll know that manipulating text within HTML tags, or even manipulating inline styles within an HTML tag, can be cumbersome and error-prone. HTML controls aim to solve this by allowing you to manipulate the page easily with your choice of .NET language, for instance, using VB.NET or C#. We’ll start by looking at the HTML controls library, then we’ll explore in more detail the properties exposed by the controls when we process a simple form containing HTML controls and code.

Table 4.1. HTML Control Classes

ClassAssociated Tags
HtmlAnchor<a href="…" runat="server">
HtmlButton<button runat="server">
HtmlForm<form runat="server">
HtmlImage<img runat="server">
HtmlInputButton

<input type="submit" runat="server">
<input type="reset" runat="server">
<input type="button" runat="server">

HtmlInputCheckBox<input type="checkbox" runat="server">
HtmlInputFile<input type="file" runat="server">
HtmlInputHidden<input type="hidden" runat="server">
HtmlInputImage<input type="image" runat="server">
HtmlInputRadioButton<input type="radio" runat="server">
HtmlInputText<input type="text" runat="server">
HtmlSelect<select runat="server">
HtmlTable<table runat="server">
HtmlTableRow<tr runat="server">
HtmlTableCell

<td runat="server">
<th runat="server">

HtmlTextArea<textarea runat="server">
HtmlGenericControlAll other HTML tags, including

<span runat="server">
<div runat="server">
<body runat="server">
<font runat="server">

The HtmlButton control creates a server-side HTML <button> tag.

<button id="myButton" OnServerClick="Click" runat="server">Click 
Here</button>

Notice that we’re using events here. On HTML controls, we need to use OnServerClick to specify the ASP.NET handler for clicks on the button, because onclick is reserved for handling clicks with JavaScript on the client side. In this example, the handler subroutine is called Click, and would be declared in a script block with the same form as the Click handlers we looked at for <asp:Button> tags previously:

<script runat="server" language="VB">
Sub Click(s As Object, e As EventArgs)
  Response.Write(myButton.ID)
End Sub
</script>
<script runat="server" language="C#">
void Click(Object s, EventArgs e) {
  Response.Write(myButton.ID);
}
</script>

In this case, when the user clicks the button, the ServerClick event is raised, the Click() subroutine is called to handle it, and the ID of the HtmlButton control is written onto the screen with Response.Write() (the Write() method of the Response object).


Created: March 27, 2003
Revised: July 12, 2004

URL: https://webreference.com/programming/asp_net4/1