ASP.NET 4 Unleashed Chapter 1. .aspx page: contains C# script and HTML code including tags. Listing 1.1 FirstPage.aspx

ASP .NET 4 Unleashed

Chapter 1

.aspx page: contains C# script and HTML code including <asp> tags.

Listing 1.1 FirstPage.aspx

Resulting HTML sent to browser.


Browser’s rendering of HTML code.

Elements of an ASP .NET Page• Directives – controls compilation

• Code declaration – contains application logic in C# or VB

• ASP .NET controls – most need to appear within a <form> tag in HTML portion

• Literal text and HTML tags – anything you can put in an HTML document

See pages 41-51

Directives• Preprocessing instructions that affect overall

behavior of pages and controls.• Directives have attributes that you can set for

affecting behavior

• Syntax: begin with @ symbol…..embed in <% %> tags with attributes:

<% @Directive attribute1 = “value” attribute2 = “value” %>

Every .aspx page will have a Page directive. One attribute of this directive indicates the language of its underlying code.


Listing 1.2 SendMail.aspx

The Import directive is used if you need to import a namespace.

Namespace a collection of related classes. In the Java world these are called packages.

Directives in ASP .NET

If the C# (or VB) code is held in the .aspx file, then it will be contained withing a <script> tag that is specified to run on the server. Here we have code written in C#.


An .aspx page is a web page, so it will contain HTML code (and could also contain JavaScript). So, you will see <head> and <body> and <form> tags, among others.


Unlike regular web pages, though, .aspx pages also include Web Server Controls. These will be represented by <asp:> tags of various sorts.

This is a Label, which ultimately renders a <span> tag in the final HTML that is sent to the client’s browser.


The id attribute of the <asp> tag determines the name of the corresponding C# or VB object in the corresponding code.


Page_Load is an event-handler method of the Page class. This is triggered when a page is going to be loaded.

Note the DateTime class…you should be familiar with this from CIS 221. You used many .NET framework classes then.


Buttons and User-Generated Events

Listing 1.6 ShowButtonClick.aspx

.aspx code

C# code




BEFORE THE BUTTON CLICK




AFTER THE BUTTON CLICK


This is the even-handler method for the button click

The Button web server control represented in an <asp> tag.

The Button control’s OnClick attribute identifies the name of the method that will be invoked when the button is clicked.


Note that the Label initially has no text. However, when the button is clicked, the C# code assigns a value into the Label’s Text property, which will cause the text to appear.


A Button control renders an HTML input tag.

A Label control renders an HTML span tag.

More with Buttons

Listing 1.7 ButtonCounters.aspx

.aspx code




BEFORE THE BUTTON CLICK




AFTER SOME BUTTON CLICKS


Like the Label control, Button controls have a Text property that can be initialized in the .aspx code and dynamically altered during runtime.


In this example, both Button controls trigger the same event-handler. So, the event-handler needs to determine which button generated the event.

The sender parameter is a reference to the event-generating control (like e.getSource() in Java event-handler methods)

The code in the Button_Click method casts sender as a Button in order to set its Text property value.

Note how the value is set by converting to a number, adding to that number, then converting back to a string.

Web Controls in the API

• Almost all Web control classes are in the System.Web.UI.WebControls Namespace.

• Almost all of the Web Controls are subclasses of WebControl

http://msdn.microsoft.com/en-us/library/8bhzsw6t.aspx

Image Buttons and Event Arguments

Listing 1.8 ShowEventArgs.aspx

.aspx code




BEFORE BUTTON CLICK




AFTER BUTTON CLICK

ViewState

• An ASP .NET approach to maintaining state between postbacks

• Keeps track of values in WebControl properties as you progress through postbacks

• Accomplished by automatically creating a hidden input tag and setting values, then using these values during postback

Listing 1.9 ShowViewState.aspx

.aspx code

Listing 1.9 ShowViewState.aspx



BEFORE BUTTON CLICK

ViewState is an ASP.NET feature that enables the server controls to retain their state values across the form posts. For every ASP.NET Web Form, there will be a hidden form field called _VIEWSTATE. No matter whether the form contains any control or not, this hidden field exists as long as there is a form tag and the runat attribute set to server. The value of this hidden field contains all the state values of all the controls that are participated in the ViewState.

Listing 1.9 ShowViewState.aspxResulting HTML sent to browser.


AFTER BUTTON CLICK

Note that the value of the _VIEWSTATE tag has changed…this is because values of server controls have been modified.

Listing 1.9 ShowViewState.aspxResulting HTML sent to browser.


AFTER BUTTON CLICK

The _EVENTVALIDATION tag is a security feature. It verifies whether a postback from a control on client-side is really from that control and not from a malicious person trying to break your application. .

For more on _VIEWSTATE and _EVENTVALIDATION

• Read this link:

• http://msdn.microsoft.com/en-us/magazine/cc163512.aspx

NOTE: you can disable View State for the whole page. In the @ Page directive, enter this attribute: enableviewstate=“false”

http://msdn.microsoft.com/en-us/magazine/cc163512.aspx

http://msdn.microsoft.com/en-us/magazine/cc163512.aspx

Listing 1.11 DisableViewState.aspx

You can disable individual controls of the page. A Web Control’s EnableViewState property can be set to false




BEFORE BUTTON CLICK



Although Label2’s values are updating, Label1’s are not, because it’s View State has been disables.

AFTER 3 BUTTON CLICKS

Listing 1.10 ShowTrace.aspx

Trace attribute in @Page directive causes the page to display with detailed software trace information.


This example makes use of Calendar control.



Note: some JavaScript is generated


The Control Tree• Every web page (html or .aspx) is a hierarchy of

elements containing other elements containing other elements– The same is true for all markup documents (e.g. XML)

• Every element in an .aspx page is represented by ASP .NET via control classes (Web controls, HTML controls, or Literal controls)

• The trace shows the hierarchy of controls…this is called the Control Tree

Listing 1.13 ShowControlTree.aspx

.aspx code


HTML tags with runat=“server” are represented as HtmlControls.


<asp:> tags are represented by their corresponding WebControl-derived class.


Text in the document that is not an element with runat=“server” are represented as LiteralControls.


.This example makes use of a DropDownList, populated with ListItems.

Resulting HTML Resulting HTML after select



More About HTMLContols

Listing 1.5 HtmlControls.aspx

Note: by indicating runat=“server for an HTML element you turn it into an HtmlControl object. Therefore, you can manipulate its properties at runtime.



Listing 1.5 HtmlControls.aspx

Code-behind Files• In large-scale applications, it’s best to separate the

HTML/ASP code from the underlying C#/VB code.

• Code separation makes it possible for User Interface developers to work independently of Programmers.

• In .NET, this is accomplished through the use of code-behind files

Listing 1.14 FirstPageCodeBehind.aspx

Here we have the .aspx code (HTML with <ASP> tags only…no C# or VB code).

Listing 1.15 FirstPageCodeBehind.cs

This is a separate file. Program code is completely separated from HTML code.


Code-behind classes are partial classes.

A partial class indicates that other parts of the class (e.g. the .aspx stuff) can be defined elsewhere.

The code-behind class is a subclass of Page, which is a class in the System.Web.UI namespace.


The using keyword in C# is identical to the import keyword in Java.

Using namespaces is the same as importing packages.




BEFORE BUTTON CLICK




AFTER BUTTON CLICK

Page Events

Important Page Events

• Init– Occurs when the page is initialized (i.e. loaded from its first access

from the browser), which is the first step in the its lifecycle. No controls within the page have been created yet, so they cannot be accesses or used.

• Load– Occurs every time the browser accesses the page (including

during postback). By now controls in the page have been created and are available for use.

• Unload– Occurs when the page is unloaded from memory. This is time to

do cleanup operations.• Others: Prerender, Disposed, CommitTransaction,

AbortTransaction, Error, DataBinding See page 44

Listing 1.16 ShowPageEvents.aspx

Order of event handler processing:1)Load2)Button click (only if submit)3)PreRender




BEFORE BUTTON CLICK




AFTER BUTTON CLICK

Postback

• Postback means the Page is being requested via an HTTP Post (typically by clicking a submit button)

• When the page loads, you may want to do something ONLY if it is not a Postback (i.e. first time you come to the page)

• isPostback property can be used

Listing 1.17 ShowIsPostBack.aspx

This code will not happen if the submit button was clicked.

Using a dropdown list. No initialization of items in the markup.


Data binding a web control. In this case, a DropDownList is databound to an ArrayList




BEFORE SELECTION




AFTER SELECTING ORANGES (the obvious choice)

Listing 1.18 ShowError.aspx

.aspx code





Not an error if you’re Chuck Norris

Listing 1.21 PageTrace.aspx

.aspx code





Documents

ASP.NET 4 Unleashed Chapter 1. .aspx page: contains C# script and HTML code including tags. Listing 1.1 FirstPage.aspx