ASP.

NET
Web Applications
CE050-3-2
Web Applications
ASP.NET
Slide 2 of 12
Topic & Structure of the lesson
Understand Static Web Pages
Understand Dynamic Web Pages
Understand Browser and Web Server
The Microsoft .NET Framework
Introduction to ASP.NET
Classic ASP?
ASP.NET is Not ASP
What is ASP.NET?
ASP.NET File
How Does ASP.NET Work?
Language Support
Object Oriented
Windows and IIS Dependence
A Simple ASP.NET Example
Web Applications
ASP.NET
Slide 3 of 12
Topic & Structure of the lesson
Visual Studio
Web Forms
ASP.NET Controls
Web Controls
Validation Controls
Event Aware Controls
ASP.NET - Web Pages
A Simple Web Application
The appearance of the Simple Calculator (C#)
The Code-Behind File of the Simple Calculator Application
Creating Your First ASP.NET 2.0 Application
Creating a New Web Site
Adding Pages
Adding Web Controls
Adding Action for Button
Web Applications
ASP.NET
Slide 4 of 12
Learning Outcomes
At the end of the module, your should be
able:
To create Web Forms.
To create ASP.NET applications consisting of
multiple Web Forms.
To understand how ASP.NET pages work.
To understand the differences between client-
side scripting and server-side scripting.
To understand Web forms and code-behind
files.
Web Applications
ASP.NET
Slide 5 of 12
Key Terms you must be able to use
If you have mastered this topic, you should
be able to use the following terms correctly
in your assignments and exams:
ASP.NET
Microsoft's Server-side technology that
dynamically builds documents in response to
client requests
Web Applications
ASP.NET
Slide 6 of 12
Understand Static Web Pages
The World Wide Web was originally
designed to display static pages that is,
pages that are the same every time they
are displayed.
In fact, many pages available on the
Internet today are still static pages.
They are created using HTML only.
Web Applications
ASP.NET
Slide 7 of 12
Understand Dynamic Web Pages
Most Web pages these days display
dynamic content that is, content that
changes each time the page is retrieved.
Instead of retrieving HTML data from a file,
dynamic Web pages work by running a
program that generates the HTML sent
back to the browser.
The program can generate different HTML
each time the page is requested.

Web Applications
ASP.NET
Slide 8 of 12
Understand Browser and Web Server
The client is a Web browser that runs on the end-users
computer. In most cases, the Web browser is Microsoft
Internet Explorer, but other programs such as Mozilla
Firefox can be used as the client.
The server is software that runs on the server computer
that hosts the Web application.
For ASP.NET applications, the server software is always
Microsoft Internet Information Services (also known as
IIS).
The server computer must also have Microsoft .NET
Framework software installed, as ASP.NET is a part of
the .NET Framework.
Web Applications
ASP.NET
Slide 9 of 12
The Microsoft .NET Framework
The .NET Framework is the infrastructure for the
Microsoft .NET platform.
The .NET Framework is an environment for building,
deploying, and running applications and Services.
Microsoft's first server technology ASP (Active Server
Pages), was a powerful and flexible "programming
language". But it was to much code oriented. It was not
an application framework and not an enterprise
development tool.
The Microsoft .NET Framework was developed to solve
this problem.
Web Applications
ASP.NET
Slide 10 of 12
The Microsoft .NET Framework
Manages and executes applications
Framework Class Library (FCL)
Enforces security and supplies many other
programming capabilities
Reusable components that programmers can
incorporate into their applications
Common Language Runtime (CLR)
Executes programs written in any .NET-compatible
programming language
.NET Compact Framework

Web Applications
ASP.NET
Slide 11 of 12
The Microsoft .NET Framework
The .NET Framework consists of 3 main parts:
Programming languages:
C# (Pronounced C sharp)
Visual Basic (VB .NET)
J# (Pronounced J sharp)
Server technologies and client technologies:
ASP .NET (Active Server Pages)
Windows Forms (Windows desktop solutions)
Compact Framework (PDA / Mobile solutions)
Development environments:
Visual Studio .NET (VS .NET)
Visual Web Developer

Web Applications
ASP.NET
Slide 12 of 12
Introduction to ASP.NET
ASP.NET
ASP.NET is the latest version of Microsoft's Active
Server Pages technology (ASP).
ASP.NET is a part of the Microsoft .NET framework,
and a powerful tool for creating dynamic and
interactive web pages.
Server-side technology that dynamically builds
documents in response to client requests
Can be used on a server to create Web applications
Web-based applications create Web content for Web
browser clients.

Web Applications
ASP.NET
Slide 13 of 12
Introduction to ASP.NET
Web-Based Application Development
Creates Web content for Web browser clients
Extensible HyperText Markup Language (XHTML)
Client-side scripting
Images and binary data
Web Forms (Web Form pages)
File extension .aspx
ASPX (Web Form files) contain written code, event handlers,
utility methods and other supporting code
Supports over 25 programming languages (C#,
C++, VB, J#...)
Object-oriented programming

Web Applications
ASP.NET
Slide 14 of 12
Introduction to ASP.NET
Multi-tier, database-intensive applications
Includes optimizations for performance,
testing and security
ASPX files
XHTML documents
Static

Web Applications
ASP.NET
Slide 15 of 12
Classic ASP?
Microsoft's previous server side scripting
technology ASP (Active Server Pages) is
now often called classic ASP.
ASP 3.0 was the last version of the classic
ASP.
Web Applications
ASP.NET
Slide 16 of 12
ASP.NET is Not ASP
ASP.NET is the next generation ASP, but
it's not an upgraded version of ASP.
ASP.NET is an entirely new technology for
server-side scripting. It was written from
the ground up and is not backward
compatible with classic ASP.
ASP.NET is the major part of the
Microsoft's .NET Framework.
Web Applications
ASP.NET
Slide 17 of 12
What is ASP.NET?
ASP.NET is a server side scripting technology that
enables scripts (embedded in web pages) to be
executed by an Internet server.
ASP stands for Active Server Pages
ASP.NET is a program that runs inside IIS
IIS (Internet Information Services) is Microsoft's Internet
server
IIS comes as a free component with Windows servers
IIS is also a part of Windows 2000 and XP Professional
ASP.NET 2.0 improves upon ASP.NET by adding
support for several new features.

Web Applications
ASP.NET
Slide 18 of 12
ASP.NET File
An ASP.NET file is just the same as an
HTML file
An ASP.NET file can contain HTML, XML,
and scripts
Scripts in an ASP.NET file are executed
on the server
An ASP.NET file has the file extension
".aspx"
Web Applications
ASP.NET
Slide 19 of 12
How Does ASP.NET Work?
When a browser requests an HTML file,
the server returns the file
When a browser requests an ASP.NET
file, IIS passes the request to the
ASP.NET engine on the server
The ASP.NET engine reads the file, line
by line, and executes the scripts in the file
Finally, the ASP.NET file is returned to the
browser as plain HTML
Web Applications
ASP.NET
Slide 20 of 12
Language Support
ASP.NET uses the new ADO.NET.
ASP.NET supports full Visual Basic, not
VBScript.
ASP.NET supports C# (C Sharp) and C++.
ASP.NET supports J# (J Sharp).
ASP.NET supports JScript as before.

Web Applications
ASP.NET
Slide 21 of 12
Language Support
Visual Basic .NET: Visual Basic .NET (VB.NET) is a
modern version of the venerable Basic programming
language. Basic was originally intended as a limited
language designed for beginners, but the current version
of Visual Basic is as powerful a language as youll find.
C#: C# (pronounced C-Sharp) is a relatively new
language designed by Microsoft specifically for .NET. Its
syntax is similar to Java, so if youre an experienced
Java programmer, you wont have much trouble learning
C#.
J#: Microsofts version of Java. It isnt used much for
ASP.NET development.

Web Applications
ASP.NET
Slide 22 of 12
Object Oriented
ASP.NET is inherently object-oriented.
If youre familiar with programming and
have worked with object-oriented programming
languages such as C++ or Java, youll
appreciate the benefits immediately.
A major attraction of ASP.NETs object
orientation is that it allows you to take advantage
of a vast library of predefined classes known as
the .NET Framework.

Web Applications
ASP.NET
Slide 23 of 12
Windows and IIS Dependence
ASP.NET will only work on Microsoft Windowsbased
Web servers.
That means the operating system must be a recent
version of Windows, and the HTTP server software must
be Microsofts Internet Information Services, also known
as IIS.
Specifically, ASP.NET 2.0 requires the following support
software:
Windows 2000 Server (with Service Pack 3) or Windows Server
2003. (For development systems, Windows 2000 with SP3 or
Windows XP Professional is required.)
Internet Information Services 5.0 or later.
Microsoft .NET Framework 2.0

Web Applications
ASP.NET
Slide 24 of 12
A Simple ASP.NET Example
Scripting delimiters <% and %>
Wrapped around C# or VB.NET code
Compiled and executed on the server
@ Page directive
Specifies information needed by CLR (Common
Language Runtime) to process file
Language attribute
Specifies C# or VB.NET as scripting language
runat attribute with value server
Indicates script should be processed on server

Web Applications
ASP.NET
Slide 25 of 12
A Simple ASP.NET Example
<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>A Simple ASP.NET Example</title>
</head>
<body>
<strong>A Simple ASP.NET Example</strong><br />
<%
Response.Write("ASP.NET programming is fun!!!");
Response.Write("<br />");
Response.Write ("This page was loaded at: " + DateTime.Now.ToString());
%>
</body>
</html>
Web Applications
ASP.NET
Slide 26 of 12
A Simple ASP.NET Example
Web Applications
ASP.NET
Slide 27 of 12
A Simple ASP.NET Example
Object Name Description
Request
Used to access information passed by an
HTTP request.
Response
Used to control the information sent to the
client.
Server
Used to access methods and properties on the
server.
Commonly used ASP.NET objects.

Web Applications
ASP.NET
Slide 28 of 12
Visual Studio
One of the best features of ASP.NET is Visual
Studio, the integrated development environment
that combines a Web-page editor, a code editor,
a debugger, and several other development
tools into one easy-to-use program.
The more you work with Visual Studio, the more
you come to appreciate the many ways it
simplifies the job of creating ASP.NET Web
applications.

Web Applications
ASP.NET
Slide 29 of 12
Visual Studio
Properties
Panel
Tabs
Web
Form
Solution
Explorer
Menu
Web Applications
ASP.NET
Slide 30 of 12
Web Forms
<form> tag
Designate ASP.NET Web Form
Web controls
Web server controls
Form-like controls such as drop-down lists and text boxes
HTML server controls
Programmable HTML elements run on the server
Validation controls (validators)
Required field validator
Range validator
User controls
Created by programmer
Web Applications
ASP.NET
Slide 31 of 12
Web Forms
<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">

</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" runat="server">
<div>

</div>
</form>
</body>
</html>
Web Applications
ASP.NET
Slide 32 of 12
ASP.NET Controls
ASP.NET contains a large set of HTML controls. Almost
all HTML elements on a page can be defined as
ASP.NET control objects that can be controlled by
scripts.
ASP.NET also contains a new set of object oriented
input controls, like programmable list boxes and
validation controls.
A new data grid control supports sorting, data paging,
and everything you expect from a dataset control.
The controls use syntax such as the following:


<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Button" />
Web Applications
ASP.NET
Slide 33 of 12
Web Controls
Text and Graphics Control
Label, Button, TextBox, Image RadioButtonList
and DropDownList

Web Control Description
Label
Displays text that the user cannot edit.
Button
Triggers an event when clicked.
TextBox
Gathers user input and displays text.
Image
Displays images (e.g., GIF and JPG).
RadioButtonList
Contains a grouping of radio buttons.
DropDownList
Displays a drop-down list of choices from which the user can select
one item.
Commonly used Web controls.

Web Applications
ASP.NET
Slide 34 of 12
ASP.NET Controls
Web Controls
Web Applications
ASP.NET
Slide 35 of 12
HTML Server Controls
HTML Server
Control
Description
HtmlAnchor
Navigation link.
HtmlButton
Customizable input button.
HtmlTable
Programmatically built table.
HtmlInputFile
Handles uploading of files from client to server.
HtmlImage
Renders images.
HtmlForm
User-input form.
HTML server controls.

Web Applications
ASP.NET
Slide 36 of 12
Validation Controls
Validation Controls
Determines whether the data in another Web
control are in the proper format
Validates user input

Web Applications
ASP.NET
Slide 37 of 12
Validation Controls
Server Control Description
RequiredFieldValidator
Checks that the user does not leave a
field blank.
CompareValidator
Compares an input value with
another value. The value being
compared to may be another
controls input value.
RangeValidator
Checks that a users entry is within a
specified range.
RegularExpressionValidator
Checks that the entry matches a
regular expression pattern.
ValidationSummary
Displays the validation errors for all
the validation controls on a page.
Validation server controls.

Web Applications
ASP.NET
Slide 38 of 12
Event Aware Controls
All ASP.NET objects on a Web page can expose events
that can be processed by ASP.NET code.
Load, Click and Change events handled by code makes
coding much simpler and much better organized.
<asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" />
protected void Button1_Click(object sender, EventArgs e)
{
// Statement
}
Web Applications
ASP.NET
Slide 39 of 12
ASP.NET - Web Pages
Fundamentally an ASP.NET page is just the
same as an HTML page.
An HTML page has the extension .htm. If a
browser requests an HTML page from the
server, the server sends the page to the browser
without any modifications.
An ASP.NET page has the extension .aspx. If a
browser requests an ASP.NET page, the server
processes any executable code in the page,
before the result is sent back to the browser.
Web Applications
ASP.NET
Slide 40 of 12
Code-Behind Approach
Alternative method of adding scripts to make static
content dynamic
Not included in the .aspx file
Must be compiled first
Two source files:
The markup file (or the .aspx file) defines the
appearance of the Web page.
The code-behind file (or the .aspx.cs or .aspx.vb file)
<%@ Page Language="C#" AutoEventWireup="true"
CodeFile="Default.aspx.cs" Inherits="_Default" %>
Web Applications
ASP.NET
Slide 41 of 12
A Simple Web Application
To help you understand how a typical
ASP.NET application works, the next slide
presents a simple calculator application: It
lets the user enter two numbers, and when
the user then clicks the [Add] button, the
application adds up the two numbers and
displays the result.

Web Applications
ASP.NET
Slide 42 of 12
A Simple Web Application
Web Applications
ASP.NET
Slide 43 of 12
A Simple Web Application
The Simple Calculator page includes four
controls:
A text box that lets the user enter the first
number to be added.
Another text box that lets the user enter the
second number to be added.
A button the user can click to submit the page
and calculate the sum of the two numbers.
A label that displays the result of the addition.
Web Applications
ASP.NET
Slide 44 of 12
A Simple Web Application
To develop a single-page
ASP.NET application
such as the Simple
Calculator application,
you create two source
files:
The markup file (or the
.aspx file) defines the
appearance of the Web
page.
The code-behind file (or the
.aspx.cs or .aspx.vb file)

Web Applications
ASP.NET
Slide 45 of 12
The appearance of the Simple Calculator (C#)
Web Applications
ASP.NET
Slide 46 of 12
The Code-Behind File of the Simple Calculator Application
Web Applications
ASP.NET
Slide 47 of 12
Creating Your First ASP.NET 2.0 Application
Visual Studio organizes the files of an ASP.NET
application by using logical containers called projects
and solutions.
A project is a container that holds all files related to a single
ASP.NET application including the .aspx files that define the
applications Web pages, the code-behind files that provide the
code executed when the application runs, and other files used by
the application.
A solution is a container that can hold one or more projects.
Solutions let you group related applications.
Most solutions contain just a single project. In fact, when you
create anew Web application, Visual Studio creates two
containers: a project to hold the applications files and a solution
to hold the project.

Web Applications
ASP.NET
Slide 48 of 12
Creating a New Web Site
To create a new Web site in Visual Studio 2005, follow
these steps:
1. Choose the FileNewWeb Site command.
2. Choose ASP.NET Web Site from the list of available
templates.
3. Choose File System, HTTP, or FTP from the Location
drop-down list.
4. Enter the location for the Web site in the combo box
thats to the right of the Location drop-down list.
5. Choose the language you want to use to create the
site.
6. Click OK.

Web Applications
ASP.NET
Slide 49 of 12
Creating a New Web Site
Web Applications
ASP.NET
Slide 50 of 12
Adding Pages
1. Right Click WebsiteAdd New Item.
2. Make sure Web Form is selected in the
Templates box.
3. Enter a name for the page in the Name
text box.
4. Select the programming language.
5. Make sure the Place Code in Separate
File option is checked.
6. Click Add.

Web Applications
ASP.NET
Slide 51 of 12
Adding Pages
Web Applications
ASP.NET
Slide 52 of 12
Adding Web Controls
1. Drag and drop 4 labels, 2 textboxes and
1 button from the toolbox panel to the
web form.
2. Change the text for the controls in the
properties panel accordingly to produce
a page that is same to the figure in next
slide.
Web Applications
ASP.NET
Slide 53 of 12
Adding Web Controls

Web Applications
ASP.NET
Slide 54 of 12
Adding Action for Button
1. Double click the Add button on the web
form
2. Type the following codes.
protected void Button1_Click(object sender, EventArgs e)
{
double result = 0.0;
result = Convert.ToDouble(this.TextBox1.Text)
+ Convert.ToDouble(this.TextBox2.Text);
this.Label4.Text = "The result is: " + result.ToString();
}
Web Applications
ASP.NET
Slide 55 of 12
Adding Action for Button
Web Applications
ASP.NET
Slide 56 of 12
Debugging and Preview in Bowser
Click the Start Debugging icon or press
F5 to debug the codes and preview the
web form in browser.

Web Applications
ASP.NET
Slide 57 of 12
Q & A
Question and Answer Session