© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 1
ASP.NET 2.0
Minder Chen, Ph.D.
.NET Framework Base Class Library
ADO.NET: Data & XMLADO.NET: Data & XML
Windows Form: Windows User Interface
Common Language Runtime
ASP.NET: Web Forms & Web Services
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 2
.NET Framework
Operating SystemOperating SystemOperating SystemOperating System
Common Language RuntimeCommon Language RuntimeCommon Language RuntimeCommon Language Runtime
Base Class LibraryBase Class LibraryBase Class LibraryBase Class Library
ADO.NET and XMLADO.NET and XMLADO.NET and XMLADO.NET and XML
ASP.NETASP.NETWeb FormsWeb Forms Web ServicesWeb Services
Mobile FormsMobile Forms
ASP.NETASP.NETWeb FormsWeb Forms Web ServicesWeb Services
Mobile FormsMobile Forms
WindowsWindowsFormsForms
WindowsWindowsFormsForms
Common Language SpecificationCommon Language SpecificationCommon Language SpecificationCommon Language Specification
VBVBVBVB C++C++C++C++ C#C#C#C# JScriptJScriptJScriptJScript J#J#J#J#V
isual S
tud
io.N
ET
Visu
al Stu
dio
.NE
TV
isual S
tud
io.N
ET
Visu
al Stu
dio
.NE
T
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 6
Form Handling: No Web Server Control
<%@ Page Language="VB" %>
<!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 id="Head1" runat="server">
<title>Untitled Page</title>
</head>
<body>
<form id="form1" >
Enter your name:
<input id="Text1" name="username" type="text" />
<input id="Submit1" type="submit" value="submit" />
<% Response.Write("Hello <b>" & _
Request.Params.Get("username") & "</b>")%>
<h1>End of the active content</h1>
<%= Date.Today.ToString("MMM, dd, yyyyy") %>
</form>
</body>
</html>
Mixing HTML and Server side scripting code
Submit to the form itself (Postback) since there is no action attribute
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 11
Create an Event Procedure
• Double click on a Web Server Control• Determine the event to be associated with the control• Write appropriate code for responding to the event
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 12
Set a Breakpoint for Debugging
• Click on the sideline of the corresponding code line to set the breakpoint
• Click again to remove the breakpoint
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 13
Set as Start Page
• Your project/web site may contain many Web forms.
• When you try to run and test a specific Web page, you should set that page to be the Start page.
• Right mouse button click on the page, choose "Set As Start Page" from the pop-up menu
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 15
Web.config file
• You need to Add a new Web.config file for the whole Web site / Web application
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 17
Web Application Administration• Hand editing this file or use the web admin tool to configure settings for your
application. Use the Website->Asp.Net Configuration option in VWD
• A full list of settings and comments can be found in machine.config.comments
usually located in \Windows\Microsoft.Net\Framework\v2.x\Config
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 20
Error List
Include all errors from Web forms in the Web site
Enter Your Name:
<asp:TextBox ID="TextBox1" runat="server" OnTextChanged="TextBox1_TextChanged">
</asp:TextBox>
Just say NO!
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 22
Add Watch• Highlight a variable, an object, or a property• Right mouse button click to select the "Add Watch" from the menu
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 23
Page Load Event• Page Load event will be executed every time you access the page.
• Web server controls' events always post back to the page itself.
• Use IsPostBack function to determine whether it is the first request of the page or a post back to the page.
ASP.NET page's <form runat="server"> tag does not have the actionaction attribute, therefore all Web server controls event will send the form variables (i.e., Web server controls' data) to the same page to be processed by corresponding server-side event-handling methods.
PostbackPostback
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 24
PostBack<script runat="server"> Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs)
If IsPostBack Then LabelWelcome.Text = "Thank you, " & TextBox1.Text & _
" for using Hello World!" Else LabelWelcome.Text = "Welcome to my Hello World!" End If End Sub Protected Sub Button1_Click(…..) Label1.Text = "Hello " & TextBox1.Text End Sub
</script>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 25
Po
stBack
Po
stBack
First R
equest F
irst Request
Page/Control Event Execution
Page_LoadPage_Load
Page_PreRenderPage_PreRenderPage_UnloadPage_Unload
Textbox1_ChangedTextbox1_Changed
Button1_ClickButton1_Click
1. 1. ChangeChange Events Events
2. 2. ActionAction Events Events
Page DLL is loaded, control hierarchy initializedPage DLL is loaded, control hierarchy initialized
Page is disposedPage is disposed
Control hierarchy (Dynamically generated HTML page) is renderedControl hierarchy (Dynamically generated HTML page) is rendered
They may be triggered They may be triggered on PostBackon PostBack
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 26
ASP.NET Pages: Part Declarative, Part Code
• Combines declarative tags (HTML, ASPX directives, server controls tags, and static text) with code in a single file or in separate files.
• Unlike ASP, good separation provided between code and tags
Form1.aspxForm1.aspx Form1.aspxForm1.aspx Form1.aspx.vbForm1.aspx.vb
single file separate files (“code-behind”)
codecode
<tags><tags>codecode<tags><tags>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 27
Control Event Processing
• Events are: – Triggered on the client by the user– Handled in server code
• Requires a postback to the same pageRequires a postback to the same page• ViewState of controls saves page and control
properties between round trips, therefore helps restore control to its previous state. – Implemented as a hidden form field
– Disable via setting the EnableViewState attribute EnableViewState=false
– Data Binding resets control state
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 28
How Do Server Controls Work?• Declared with runat="server" Attribute
• When the ASP.NET Page is executed:– Creates action and method attributes of form– Adds unique id and name attributes to
controls (id is used by ASP.NET and name is used by HTML form controls)
– Adds value attribute to controls (to set the default value for initial display)
– Adds a Adds a hiddenhidden control to the form to control to the form to save save view stateview state information information
<asp:textbox id="TextBox1" runat="server"></asp:textbox><asp:textbox id="TextBox1" runat="server"></asp:textbox>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 29
Generated Generated HTML Source Code on First Request of Hello2.aspx
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD>
<title>Hello2</title><meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0"><meta name="CODE_LANGUAGE" content="Visual Basic 7.0"><meta name="vs_defaultClientScript" content="JavaScript"><meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD><body>
<form name="Form1" method="post" action="Hello2.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTM3NjQ2NjY2NTs7PmhdqcuyzroBSmx2I5btO60KJNMH" /><P>Enter your name: <br>
<input name="TextBox1"name="TextBox1" type="text" id="TextBox1"id="TextBox1" /> </P>
<P>
<input type="submit" name="Button1" value="Submit" id="Button1" /> </P>
<P>
<span id="Label1"></span> </P>
<span id="Label2">First Time</span> </P></form></body></HTML>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 30
Page Generated After Submission (Postback)<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML>
<HEAD><title>Hello2</title><meta name="GENERATOR" content="Microsoft Visual Studio.NET 7.0"><meta name="CODE_LANGUAGE" content="Visual Basic 7.0"><meta name="vs_defaultClientScript" content="JavaScript"><meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD><body>
<form name="Form1" method="post" action="Hello2.aspx" id="Form1">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTM3NjQ2NjY2NTt0PDtsPGk8MT47PjtsPHQ8O2w8aTw1Pjs+O2w8dDxwPHA8bDxUZXh0Oz47bDxNaW5kZXIgQ2hlbjs+Pjs+Ozs+Oz4+Oz4+Oz5b3aOb+KbJ2SN3XL/SHoP/3gJUvg==" />
<P>Enter your name:</P><P>
<input name="TextBox1" type="text" value="Minder Chen"value="Minder Chen" id="TextBox1" /> </P>
<P><input type="submit" name="Button1" value="Submit" id="Button1" /></P>
<P> <span id="Label1">Minder Chen</span></P>
<P> <span id="Label1">Post back</span></P></form></body></HTML>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 31
ViewState and PostBackHello2.aspx.vb
If Not IsPostBack …First Request
Response
__VIEWSTATE = "dDwt…"
<Input id="TextBox1">Minder Chen
Post back to the same page
__VIEWSTATE = "dDwt…" Textbox1.Text = "Minder Chen"
States of a page is maintained via the ViewState between the Postback
Hello2.aspx
<asp:textbox id="TextBox1" runat="server" />
__VIEWSTATE = "dDwt…"<Input id="TextBox1" value="Minder Chen" …>
ResponseDefault value
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 33
Web Form Designer
RadioButtonList
Checkbox with AutoPostBack
PanelVisible = False
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 36
RadioButtonList.aspx<%@ Page Language="VB" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server"> Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) If CheckBox1.Checked Then Label1.Text = "You know ASP.NEt 2.0 <br>" Label1.Text &= "Your level of expertise is: " & RadioButtonList1.SelectedItem.Text _
& "<br>" Label1.Text &= "Your level of expertise code is: " & RadioButtonList1.SelectedValue Else Label1.Text = "You don't know ASP.NET 2.0 <br>" End If End Sub Protected Sub CheckBox1_CheckedChanged (ByVal sender As Object, ByVal e As System.EventArgs)
If CheckBox1.Checked Then Panel1.Visible = True Else Panel1.Visible = False End If End Sub Protected Sub Page_Load (ByVal sender As Object, ByVal e As System.EventArgs) Label1.Text = " " ' Reset error message End Sub</script>
Panel1.Visible = Not Panel1.Visible
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 37
Code -- Continued<html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server"> <title>RadioButtonList </title></head><body> <form id="form1" runat="server"> <div> <strong><span style="font-size: 14pt">Auto Postback + Checkbox + DadioButtonList <br /> <br /> <asp:CheckBox ID="CheckBox1" runat="server" AutoPostBack="True" Text="I know ASP.NET 2.0"
OnCheckedChanged="CheckBox1_CheckedChanged" /><br /> <br /> </span></strong> <asp:Panel ID="Panel1" runat="server" BorderStyle="Outset"
Height="136px" Visible="False" Width="256px"> <strong>Choose your level of expertise<br /> in ASP.NET 2.0 </strong> <br /> <asp:RadioButtonList ID="RadioButtonList1" runat="server" Font-Bold="True" Width="136px"> <asp:ListItem Selected="True" Value="1">Basic</asp:ListItem> <asp:ListItem Value="2">Intermediate</asp:ListItem> <asp:ListItem Value="3">Advanced</asp:ListItem> </asp:RadioButtonList> </asp:Panel> </div> <br /> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit" /> <br /> <br /> <asp:Label ID="Label1" runat="server" Font-Bold="True"></asp:Label> </form></body></html>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 38
Add.aspx <%@ Page Language="VB" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<script runat="server"> Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) ' Label1.Text = TextBox1.Text + TextBox2.Text Dim x1, x2, result As Single x1 = CType(TextBox1.Text, Single) x2 = CType(TextBox2.Text, Single) result = x1 + x2 ' Format String Expression "c" for currency format ' Label1.Text = Format(result, "c") Label1.Text = result.ToString("C") End Sub</script><html xmlns="http://www.w3.org/1999/xhtml" ><head runat="server“><title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <strong><span style="font-size: 14pt">Add two numbers<br /> </span></strong>Number 1: <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox><br /> Plus (+)<br /> Number 2: <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox><br /> <br /> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Submit" /><br /> <br /> Answer: <asp:Label ID="Label1" runat="server"></asp:Label> </div> </form> </body> </html>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 39
Add.aspx with Exception Handling
Protected Sub Button1_Click(ByVal sender As Object, ByVal e As System.EventArgs) ' Label1.Text = TextBox1.Text + TextBox2.Text Dim x1, x2, result As Single Label1.Text = ""
Try x1 = CType(TextBox1.Text, Single) Catch ex As Exception Label1.Text = "Number 1 is not a number. " & ex.Message & " <br> " End Try Try x2 = CType(TextBox2.Text, Single) Catch ex As Exception Label1.Text &= “Number 2 is not a number. " & ex.Message End Try If Label1.Text <> "" Then Exit Sub End If result = x1 + x2 ' Format String Expression "c" for currency format ' Label1.Text = Format(result, "c") Label1.Text = result.ToString("C") End Sub</script>
© Minder Chen, 2001-2005 ASP.NET 2.0: Introduction - 40
Runtime Compilation
ASPXFile
RequestRequest
ASPXASPX
EngineEngine
ParseParse
Gen’dPageClass
GenerateGenerate
ResponseResponse
RequestRequest
InstantiateInstantiate
ResponseResponse
Code-Code-behindbehindclassclass
PagePage
ClassClass Instantiate, Instantiate, Process and Process and
RenderRender
CompileCompile