Developing Web Applications Using Microsoft Visual Studio 2008

Developing Web
Applications Using
Microsoft® Visual
Studio® 2008
Module 4: Adding Code to a Microsoft ASP.NET
Web Form
• Implementing Code-Behind Pages
• Adding Event Procedures to Web Server Controls
• Handling Page Events

Lesson: Implementing Code-Behind Pages
• Methods for Implementing Code
• Writing Inline Code
• What Are Code-Behind Pages?
• How Code-Behind Pages Work

Methods for Implementing Code
• Three methods for adding code:
 Put code in the same file as content (mixed)
 Put code in a separate section of the content file (inline code)
 Put code in a separate file (code-behind pages)
• Code-behind pages are the Visual Studio 2008 default

Writing Inline Code
• Code and content in the same file
• Different sections in the file for code and HTML
[Visual C#]
<SCRIPT Language="c#" runat="server">
private void Button1_Click(object sender,
System.EventArgs e) {
}
</SCRIPT>
<html xmlns="http://www.w3.org/1999/xhtml">
<asp:Button ID=“Btn1" runat="server" Text=“Button" />
</html>
[Visual Basic]
<SCRIPT Language="vb" runat="server">
Sub Button1_Click(ByVal s As Object, ByVal e As _
EventArgs) Handles Button1.Click
End Sub
</SCRIPT>
<html xmlns="http://www.w3.org/1999/xhtml">
<asp:Button ID="Btn1" runat="server" Text="Button" />
</html>
What Are Code-Behind Pages?
• Separation of code from content
 Developers and UI designers can work independently
Single file Separate files
code
<tags> code
<tags>
Form1.aspx Form1.aspx Form1.aspx.cs

or Form1.aspx.vb
How Code-Behind Pages Work
• Create separate files for user interface and interface logic
• Use @ Page directive to link the two files

 CodeFile
 Inherits
 AutoEventWireup
• Pre-compile or JIT-compile
Default.aspx Default.aspx.cs
<%@ Page Language="C#" public partial class _Default :
AutoEventWireup="true“ System.Web.UI.Page
CodeFile="Default.aspx.cs {
" Inherits="_Default" %> private void Button1_Click()
{
...
}
}
Lesson: Adding Event Procedures to Web
Server Controls
• What Are Event Procedures?
• Client-Side Event Procedures
• Server-Side Event Procedures
• Multimedia: Client-Side and Server-Side Events
• Creating Event Procedures
• Demonstration: Creating an Event Procedure
• Interacting with Controls in Event Procedures

What Are Event Procedures?
• Action in response to a user’s interaction with the controls
on the page
Client-Side Event Procedures
• Implement for only HTML controls
• Interpreted by the browser and run on the

client
• No access to server resources
• Use <SCRIPT language="language">
Client-side
Internet
Internet
.HTM
Pages
Server-Side Event Procedures
• Implement for both Web and HTML server
controls
• Compiled and run on the server
• Access to server resources
• Use <SCRIPT language=“cs" runat="server">

or <SCRIPT language=“vb" runat="server">
Server-side
Internet
Internet
Internet .ASPX
Pages
Multimedia: Client-Side and Server-Side Events
Creating Event Procedures
• Visual Studio 2008 creates an event procedure
template
[Visual C#]
private void Button1_Click(object s, System.EventArgs e)
{
[Visual Basic]
Private Sub Button1_Click(ByVal s As System.Object, _
ByVal e As System.EventArgs) Handles Button1.Click
End Sub
Note: Visual Basic uses the Handles keyword so that you

can add many event procedures to one event
Demonstration: Creating an Event Procedure
• Create a Web Form by using Visual Studio 2008
• Add controls to the Web Form
• Add a Click event procedure
• Browse the page

Interacting with Controls in Event Procedures
• Read the properties of Web server controls
[Visual C#]
greetingString = "Hello " & nameTextBox.Text;
[Visual Basic]
greetingString = "Hello " + nameTextBox.Text;
• Output responses to other Web server controls
[Visual C#]
greetingLabel.Text = "new text";
[Visual Basic]
greetingLabel.Text = "new text"
Lesson: Handling Page Events
• The Page Event Life Cycle
• Multimedia: The PostBack Process
• Demonstration: Handling Events
• Handling Page.IsPostback Events
• Linking Two Controls Together
• Demonstration: Linking Controls Together

The Page Event Life Cycle
Page_PreInit
Page_Init
Page_PreLoad
Control events Page_Load
Change Events Textbox1_Changed
Action Events Button1_Click
Page_Unload
Page is disposed
Multimedia: The PostBack Process
Demonstration: Handling Events
• View the page
• Change a check box to a Web server control
• Implement a Page.IsPostBack test

Handling Page.IsPostback Events
• Page_Load fires on every request
 Use Page.IsPostBack to execute conditional logic
 Page.IsPostBack prevents reloading for each postback
[Visual C#]
protected void Page_Load(object sender, EventArgs e)
{
if (!Page.IsPostBack) {
}
}
[Visual Basic]
Protected Sub Page_Load(ByVal s As System.Object, _
ByVal e As System.EventArgs) Handles Me.Load
If Not Page.IsPostBack Then
End If
End Sub
Linking Two Controls Together
• Linking one control to another is useful for taking

values from list boxes or drop-down lists
• Data binding
<form runat="server">
[Visual C#]
<asp:DropDownList id=“occupationList"
protected void Page_Load(object sender, EventArgs e)
{ autoPostBack="true" runat="server" >
<asp:ListItem>Program Manager</asp:ListItem>
selectedValueLabel.DataBind();
} <asp:ListItem>Tester</asp:ListItem>
<asp:ListItem>User Assistance</asp:ListItem>
</asp:DropDownList>
[Visual
<p>YouBasic]
selected: <asp:Label id=“selectedValueLabel"
Protected Sub Page_Load(ByVal
Text="<%# sender As Object, _%>"
occupationList.SelectedItem.Text
ByVal e As System.EventArgs)
runat="server" /> Handles Me.Load
selectedValueLabel.DataBind()
</p>
End Sub
</form>
Demonstration: Linking Controls Together
• View the controls
• Link a Label to a ListBox control
• Bind data to the Label control
• Build and browse

Lab: Adding Functionality to a Web Application
• Exercise 1: Creating a Page_Load Event Procedure
• Exercise 2: Creating a Click Event Procedure
• Exercise 3: (If Time Permits): Implementing a Component

in a User Control
Logon information
Virtual machine 2310C-LON-DEV-04

User name Student
Password Pa$$w0rd
Estimated time: 45 minutes

Lab Scenario
Lab Web Master Page
Logon Page Application benefitsMaster.master
login.aspx
Benefits
Home Page
ASPState
Default.aspx Page Header
header.ascx
Menu Component
Registration Benefits.cs or Benefits.vb
register.aspx TempDB
Web.
config
Life Insurance Retirement Medical Dentists

life.aspx retirement.aspx medical.aspx dental.aspx
Prospectus
prospectus.aspx Doctors User Control XML Web
LINQ to SQL doctors.aspx nameDate.ascx Service
Classes DentalService1.asmx
Doctors.dbml
Doctors Dentists
XML Files
Lab Review
Review Questions
• How can you run code only when a Web page loads for the
first time?
• Where do the control event procedures occur in the page
event life cycle?
• What is the default event procedure for common controls?
• How can you add items to a list in Design view?

Module Review and Takeaways
• Review Questions
• Real-World Issues and Scenarios
• Best Practices

Developing Web Applications Using Microsoft Visual Studio 2008

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Developing Web Applications Using Microsoft Visual Studio 2008

Uploaded by

Copyright:

Available Formats

Developing Web

• Adding Event Procedures to Web Server Controls

• Handling Page Events

• Writing Inline Code

• What Are Code-Behind Pages?

• How Code-Behind Pages Work

• Code-behind pages are the Visual Studio 2008 default

• Different sections in the file for code and HTML

Single file Separate files

Form1.aspx Form1.aspx Form1.aspx.cs

• Use @ Page directive to link the two files

• Client-Side Event Procedures

• Server-Side Event Procedures

• Multimedia: Client-Side and Server-Side Events

• Creating Event Procedures

• Demonstration: Creating an Event Procedure

• Interacting with Controls in Event Procedures

• Interpreted by the browser and run on the

• Access to server resources

• Use <SCRIPT language=“cs" runat="server">

Note: Visual Basic uses the Handles keyword so that you

• Add controls to the Web Form

• Add a Click event procedure

• Browse the page

• Output responses to other Web server controls

• Multimedia: The PostBack Process

• Demonstration: Handling Events

• Handling Page.IsPostback Events

• Linking Two Controls Together

• Demonstration: Linking Controls Together

Control events Page_Load

Change Events Textbox1_Changed

Action Events Button1_Click

• Change a check box to a Web server control

• Implement a Page.IsPostBack test

• Linking one control to another is useful for taking

• Link a Label to a ListBox control

• Bind data to the Label control

• Build and browse

• Exercise 2: Creating a Click Event Procedure

• Exercise 3: (If Time Permits): Implementing a Component

Virtual machine 2310C-LON-DEV-04

Estimated time: 45 minutes

Life Insurance Retirement Medical Dentists

• How can you add items to a list in Design view?

• Real-World Issues and Scenarios

You might also like