Lecture 1 contains Introduction to the Web ASP.NET overview ASP.NET Controls Page Class

1. ASP.NET 4.0
Julie Iskander
MSC. Communication and Electronics

2. Lab Setup
 Windows 7 (not limited edition)
 IIS 7.x
 MS SQL Server 2008 +
 MS Visual Studio 2010 +

3. Lecture Outlines
 Introduction to the Web
 ASP.NET overview
 ASP.NET Controls
 Page Class

4. Introduction to the
Web

5. Introduction to the Web
 Client/Server Architecture
 Web Technologies (Client Side Versus
Server Side)

6. Client/Server Architecture
 What is a web client?
 What is a web server?
 Web server examples (IIS, Apache,
nginx,GWS, lighttpd…………etc.)

7. Client/Server Architecture

8. Web Technologies
Client Side and Server Side

9. ASP.NET Overview

10. ASP.NET Overview
 What is ASP.NET?
 ASP.NET and MS Visual Studio
 Example
 How do ASP.NET works?
 PostBack
 Example

12. What is ASP.NET?
 ASP.NET is a free web framework for building
WebSites and WebApplications using HTML,
CSS and JavaScript and .Net Framework.
 Microsoft definition from www.asp.net
 ASP.NET is a WebApplication framework
developed by Microsoft to allow programmers
to build dynamic WebSites, WebApplications
and WebServices.
 First released, January 2002 with .NET
Framework 1.0, and is the successor to
Microsoft’s ASP technology.
 From Wikipedia.com

13. ASP.NET and MS. Visual
Studio
 Unified web development model for building
web applications.
 A new programming model and
infrastructure.
 Separates code from HTML
 Provides a GUI designer and a fully
integrated debugging support.
 Is a compiled, .NET based environment.
 Event-driven model
 Applications are written in any .NET
compatible language (VB.NET, C#,…., etc.)

14. ASP.NET and MS. Visual
Studio
 ASP.NET supports three approaches
to build web sites:
◦ Web Pages using WebMatrix
◦ MVC
◦ Web Forms

15. ASP.NET and MS. Visual
Studio

16. Convert from an HTML to an aspx page

17. Define: RoundTrip, PostBack

18. PostBack
 An HTTP POST to the same page that
the form is on.
 The contents of the form are POSTed
back to the same URL as the form.
 Allows a page to perform validation
and processing on its own form data.

19. PostBack

21. ASP.NET Coding Model
 Inline Code Model
 Code Behind Model
◦ We work with this model for better
organization of code and separation of
concerns

25. ASP.NET
 ASP.NET is OO so everything is represented with classes
and objects
 The application starts once the first request to the application
and must not be restarted often, except for maintenance.
 The page is compiled and cached on first request.
 Each Application has a virtual directory on the web server.
 ASP.NET is event-driven. There are:
1. global application events.
2. page related events
3. control related events
 Note : Eventually, the page is rendered
into HTML.

26. How do ASP.NET works?
 Runs on the web server.
 Renders appropriate markup (HTML) to
the requesting browser.
 Completely object-oriented.
 Works with HTML elements using
properties, methods, and events.
 Controls look and feel through skins,
themes and master-pages

27. How do ASP.NET works?
 A simple request flow:
1. A page is requested by a client
2. Web server sends it to the worker process
(w3wp.exe)
3. Worker process processes the request and
returns response
a. Instantiates a page object
b. Run page events
c. Instantiates control objects
d. Run control events
e. Render page to html
f. Destroys page object
4. Web server sends response to the client

28. How do ASP.NET works?
 HTTP is a stateless protocol.
 In ASP.NET, after page rendering to
HTML, the page objects is destroyed.
 However, ASP.NET has state
management techniques using session
state, view state, cookies, query
string,…… to save user information and
controls state.

29. ASP.NET Page Object
Generation
 A merge between the generated code,
and the partial class you write in the
*.aspx.cs file

31. ASP.NET Controls

32. ASP.NET Controls
 HTML Controls
 HTML Server Controls
 Web Controls

33. HTML Controls
 Ordinary XHTML tags
 Stateless
 Aren’t accessed in server code except
if runat=“server” attribute is added
 HTML Server Control

34. HTML Server Controls
 Equivalents for standard HTML elements.
 Provide an object interface for HTML
elements.
 Retain their state between postbacks
 The HTML Control Classes defined in the
System.Web.UI.HtmlControls namespace.
 Fire server-side events
◦ ServerClick  actually post back the page,
◦ ServerChange  it doesn’t occur until the
page is posted back.

35. HTML Server Controls

37. Web Controls
 Provide Windows closely-resembled
controls.
 Feature user interface elements that
may have/haven’t a direct HTML
equivalent, such as the Label,
TextBox, GridView, Calendar, and
validation controls.
 Adaptive rendering

38. Web Controls

39. Web Controls

41. Convert from an HTML to an aspx page

42. Remember
The web form is
recreated with every
round-trip. It doesn’t
persist or remain in
memory longer than it
takes to render a single
request.

43. Remember
Only one form can
has a runat=server
attribute in each
page

45. View State
 ASP.NET has an integrated state
serialization mechanism.
 Hidden field to store information, in a
compressed format, about the state of
every control in the page.
 Advantage free server resources
 Disadvantage  bigger page size,
longer receive and
post time

46. View State
 Serialization is the process of
converting an object into a stream of
bytes in order to persist it to memory,
a database, or a file. Its main purpose
is to save the state of an objet in order
to be able to recreate it when needed.
The reverse process is called
deserialization.
 ViewState is serialized as a Base64
string

47. Viewstate
 Enable ViewState property, to enable
the storage of controls values.
◦ EnableViewState=false, a small amount
of viewstate info is still stored
(controlstate), it can never be disabled.
◦ EnableViewstate=false, has effect on
datagrids

50. Page Class

51. Page Class
 Page Lifecycle
 Page Class properties
 Page as a Container
 Event Model
 How PostBack Events Work?

52. Page Life Cycle

53. Convert from an HTML to an aspx page

54. Page Class
 Inherits System.Web.UI.Page
 Basic Property
◦ IsPostBack :
 boolean
◦ Request:
 HttpRequest object info about the user’s browser, to
transmit information from one page to another using
query string, to RETRIEVE cookies,
◦ Response:
 HttpResponse object to redirect to a different web
page, to CREATE cookies.
◦ Server:
 HttpServerUtility object tasks as to encode text

55. Sending user to another
page
Response.Redirect() Server.Transfer()
 Sends a redirect msg to
client, which then sends
a request for the new
page (round trip)
 Can redirect to any page
in the website or any
absolute URL.
 Client Browser reflects
the URL Change
 Starts processing the
new page and sends the
rendered HTML.
 Can’t access pages
outside web application,
or non-ASP.NET page.
 Client Browser URL isn’t
changed  no bookmark
support

56. Page As A Control Container
 After creating page object
 Foreach element with runat=server
attr.
◦ Create control object
◦ Configure properties
◦ Add to controls collection
of the page
 The same happened recursively for
nested controls

57. Page As A Control Container
 Page.Controls
 Page.FindControl(“ControlID”);

58. Convert from an HTML to an aspx page

59. AVOID
INITIAIZING IN
CODE, USE
CONTROL TAG
PROPERTIES.
Remember:
Initializing a control in
Page.Load counts as a
change and is stored in
the viewstate.

60. Events Model
 AutoPostBack
 Events, Event Handling happens in
two ways:
Wait for next postback
A single postback results
in several change events,
which fire one
after the other, in an
undetermined order.
Automatic postback
Force a control to
postback immediately.

61. How PostBack Events Work?

62. How PostBack Events Work?
 On Server Side:
◦ ASP.NET re-creates the Page object.
◦ ASP.NET retrieves state info from the hidden viewstate field to
update the controls.
◦ The Page.Load event is fired.
◦ The appropriate change events are fired for the controls.
◦ The Page.PreRender event fires, and the page is rendered.
◦ The Page.Unload event is fired.
◦ The new page is sent to the client.

64. Reading Assignment 1
 ASP.NET Page Life Cycle Overview ,
http://msdn.microsoft.com/en-
us/library/ms178472.aspx
 View State Chunking

65. Report #1
 What is the difference between a web
page and a web site and a web
application?
 What’s the difference between
Website project and web application
project in visual studio?

66. Lab #1
The aim of the labs is to create a
website to sell books, the site will be
called Bookies.com.
 First I need to register my data (name,
gender, age, preferences, country, city)
(register.aspx)
 Then I will browser through books
images and titles that are put in a table
structure by default 2 rows and 2
columns with a more link for more data.

67. Lab hints
 Lab steps:
◦ Put your controls
◦ Add styles necessary
◦ Start adding functionality
 Use html controls whenever possible
 Html hints
◦ Search for fieldset and legend tags
 Use
◦ Request.QueryString
◦ HyperLink.NavigationUrl
◦ HyperLink.Enabled
 Enjoy ASP.NET!!!

68. Report #1
 What is the difference between a web
page and a web site and a web
application?
 What’s the difference between
Website project and web application
project in visual studio?

69. REFERENCES
 [1] Beginning ASP.NET 4 In C# 2010, Matthew
Macdonald, Apress
 [2] Web Application Architecture Principles, Protocols
And Practices, Leon Shklar And Richard Rosen, Wiley
 [3] Professional AS P.NE T 4 In C# And VB, Bill Evjen,
Scott Hanselman And Devin Rader, Wiley
 [4] Pro ASP.NET In C# 2010, Fourth Edition,matthew
Macdonald, Adam Freeman, And Mario Szpuszta,
Apress
 http://asp.net-tutorials.com/
 http://www.asp.net/
 http://msdn.microsoft.com/en-us/library/ee532866.aspx
back