Chapter 9 - Department of Computer Information Systems
Chapter 9 - Department of Computer Information Systems
Chapter 9 - Department of Computer Information Systems
You also want an ePaper? Increase the reach of your titles
YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.
CIS 3260 – Intro to Programming in C#<br />
Web Applications<br />
McGraw-Hill<br />
© 2010 The McGraw-Hill Companies, Inc. All rights reserved.<br />
Explain the functions <strong>of</strong> the server and the<br />
client in Web programming<br />
Create a Web Form and run it in a browser<br />
Describe the differences among the various<br />
types <strong>of</strong> Web controls and the relationship<br />
<strong>of</strong> Web controls to controls used on<br />
Windows forms<br />
Understand the event structure required for<br />
Web programs<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-2<br />
Create multiple pages in a Web application<br />
Navigate using the HyperLink control and<br />
the Server object<br />
Validate Web input using the validator<br />
controls<br />
Use state management to preserve values in<br />
variables<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-3<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 1
CIS 3260 – Intro to Programming in C#<br />
Web Forms are used to create the user<br />
interface for Web applications<br />
A Web Form displays as a document in a<br />
browser<br />
You can create documents that display on<br />
mobile devices, such as cell phones and PDAs<br />
(using the Standard Edition and above)<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-4<br />
• Web applications require a server and<br />
a client<br />
– Server sends the Web Pages to the client<br />
– Client displays the Web Pages in a<br />
browser<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-5<br />
To develop Web applications<br />
◦ Use a remote Web server<br />
◦ Make your local machine a Web server<br />
• Visual Studio Web Server<br />
• Installs automatically with Visual Web Developer or Visual<br />
Studio<br />
• Simplifies development, testing, and debugging<br />
• Use IDE tools to transfer application to an IIS Web server<br />
after development to share with others<br />
• Internet <strong>Information</strong> Services (IIS)<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-6<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 2
CIS 3260 – Intro to Programming in C#<br />
Browsers display pages written in a markup<br />
language such as HTML or XHTML<br />
Pages may also contain program logic<br />
◦ Script<br />
• JavaScript, VBScript, JScript<br />
◦ Java applets<br />
Programming for the Internet<br />
◦ Test and check output on multiple browsers<br />
• Internet Explorer, Mozilla FireFox and Opera<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-7<br />
Web pages are stateless<br />
◦ The page does not store any information about<br />
its contents from one invocation to the next<br />
Techniques for working around the<br />
stateless limitation<br />
◦ Storing cookies on the local machine<br />
◦ Sending state information to the server as part <strong>of</strong><br />
the page's address, called the uniform resource<br />
locator (URL)<br />
• The server can send the state information back with the<br />
next version <strong>of</strong> the page<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-8<br />
ASP.NET 3.5 is the latest Web programming<br />
technology from Micros<strong>of</strong>t<br />
ASP.NET provides libraries, controls, and<br />
programming support for programs that:<br />
◦ Interact with the user<br />
◦ Maintain state<br />
◦ Render controls<br />
◦ Display data<br />
◦ Generate appropriate HTML<br />
Write object-oriented, event-driven Web<br />
applications using C# and ASP.NET<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-9<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 3
CIS 3260 – Intro to Programming in C#<br />
Each Web Form has two distinct pieces<br />
◦ HTML and instructions needed to render the page<br />
◦ C# code<br />
A Web Form generates two files:<br />
◦ .aspx extension for the HTML<br />
◦ .aspx.cs extension for the C# code<br />
• Holds the logic to respond to events<br />
• Called the "code behind" file<br />
C# code is not compiled into an .exe file, it<br />
is compiled into a dynamic link library (dll)<br />
file located on the server<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-10<br />
IIS on a local computer hosts a Web server<br />
that must be secured<br />
Requires administrative rights on the<br />
computer to create IIS Web projects<br />
By default files are stored in<br />
C:\inetpub\wwwroot folder<br />
◦ A virtual IIS directory can be created to store a Web<br />
site<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-11<br />
Select New Web Site from the File menu<br />
In the New Web Site dialog box, select the<br />
template, location, and language<br />
Give the Web<br />
site a name<br />
by appending<br />
the name to<br />
the location<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-12<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 4
CIS 3260 – Intro to Programming in C#<br />
A new Web site automatically contains one<br />
Web page, Default.aspx<br />
◦ Visual representation <strong>of</strong> the page (HTML tags)<br />
A second file, Default.aspx.cs, holds the C#<br />
code for the page<br />
ASP.NET has a second model for Web<br />
applications—single-file model<br />
◦ Stores all HTML, control definitions, and code in<br />
one single file<br />
The textbook teaches the code-separation<br />
model that uses two separate files<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-13<br />
Differences between a Web application and<br />
a Windows Forms application<br />
◦ Web Form (page or document) not a Windows<br />
Form<br />
◦ Toolbar<br />
◦ List <strong>of</strong> files in the Solution Explorer<br />
◦ Toolbox has different controls<br />
• Properties and events different than controls that have a<br />
Windows counterpart<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-14<br />
Three tabs at bottom <strong>of</strong> Web Form<br />
◦ Design<br />
◦ Split<br />
• Splits the Document window horizontally to see both<br />
the design and source<br />
◦ Source<br />
• Static HTML code<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-15<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 5
CIS 3260 – Intro to Programming in C#<br />
Several types <strong>of</strong> controls available for Web<br />
Forms<br />
◦ Standard (ASP.NET server controls)—Richest and<br />
most powerful controls provided by ASP.NET and<br />
.NET framework<br />
◦ Data—Display database data<br />
◦ Validation—Validate user input before it is sent to<br />
server<br />
◦ Navigation—Includes the Menu control<br />
◦ Login—Login controls and wizards<br />
◦ WebParts—Change the appearance and behavior<br />
<strong>of</strong> the interface from the browser<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-16<br />
Web application files differ greatly from a<br />
Windows application<br />
aspx file<br />
◦ Holds specifications for the user interface used by<br />
the server to render pages<br />
aspx.cs file<br />
◦ Code-behind file for the aspx file<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-17<br />
The IDE does not automatically generate the<br />
code necessary for debugging a Web<br />
application<br />
Run without Debugging<br />
◦ Ctrl + F5 or Debug/Start without debugging<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-18<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 6
CIS 3260 – Intro to Programming in C#<br />
If you try to run with debugging (F5), a<br />
message box gives the choice to run<br />
without debugging or add the debugging<br />
code to the Web.config file<br />
◦ Add the following line <strong>of</strong> code to the Web.config<br />
file to run with debugging<br />
<br />
Set breakpoints, single step execution, and<br />
display the contents <strong>of</strong> variables and<br />
properties at debugging time<br />
Always remove debugging support before<br />
deploying an application<br />
◦ Debugging code slows an application<br />
considerably<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-19<br />
HTML tables contain<br />
rows and columns<br />
and allow control<br />
over placement <strong>of</strong><br />
elements on a Web<br />
page<br />
Add controls and text<br />
to the table cells to<br />
align the columns<br />
A table is an HTML<br />
control, which<br />
requires no serverside<br />
programming<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-20<br />
Add controls to any table cell or type text in a<br />
cell during design time<br />
◦ To refer to the text in a cell at run time, add a label<br />
and give it an ID or type text directly into the cell<br />
◦ Merge cells to allow room for a title or a larger<br />
image<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-21<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 7
CIS 3260 – Intro to Programming in C#<br />
Places controls in a specific X and Y<br />
position<br />
◦ Controls may not show up if user has set browser<br />
window to small size<br />
◦ Controls may overlap if the user has selected a<br />
large font size for the browser window<br />
Controls can be dragged using the white<br />
tab at the top <strong>of</strong> a selected control<br />
Controls remain in the same position<br />
relative to the Web page<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-22<br />
ASP.NET provides several techniques to<br />
navigate from one Web page to another<br />
Easiest form <strong>of</strong> navigation is to use a<br />
HyperLink control<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-23<br />
Add a HyperLink control to allow the user to<br />
navigate to another page or another site<br />
Set properties <strong>of</strong> the HyperLink control<br />
◦ Text—Text to display for the user<br />
◦ NavigateUrl—Specify the URL to which to navigate<br />
• For another Web site, type the Web address (URL)<br />
• For another page in the application, use the Select URL<br />
dialog box and select the page from a list<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-24<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 8
CIS 3260 – Intro to Programming in C#<br />
Add a new form to the project<br />
Add controls to the new page<br />
Add a HyperLink to the Main Page<br />
Set the Start Page<br />
Run the application, test the links<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-25<br />
At times a hyperlink cannot be used because<br />
some other action in code needs to be<br />
performed prior to the transfer<br />
Transfer to another page in code<br />
◦ Use the Server.Transfer method<br />
Server.Transfer (“Offer.aspx”);<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-26<br />
ASP.NET provides several validator controls<br />
that can automatically validate input<br />
◦ Add a validator control<br />
◦ Attach it to the controlToValidate (such as a text<br />
box)<br />
A blank entry passes the validation for each<br />
<strong>of</strong> the controls except the<br />
RequiredFieldValidator<br />
Enter a complete message in the<br />
ErrorMessage property or set the property to<br />
an asterisk<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-27<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 9
CIS 3260 – Intro to Programming in C#<br />
Validator Controls<br />
RequiredFieldValidator<br />
CompareValidator<br />
Requires that the user enter something into the<br />
field<br />
Compares the value in the field to the value in<br />
another control or to a constant. Also can be<br />
used to verify that the input value can be<br />
converted to the correct data type<br />
RangeValidator<br />
RegularExpressionValidator<br />
ValidationSummary<br />
Requires that the input value falls in the specified<br />
range<br />
Validates against a regular expression, similar to<br />
the mask in a masked text box<br />
Displays a summary <strong>of</strong> all <strong>of</strong> the messages from<br />
the validator controls<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-28<br />
Web pages hold static data<br />
Each time a page is displayed or redisplayed<br />
it is a fresh copy<br />
Each time the page is posted back to the<br />
server a new copy <strong>of</strong> the program is loaded<br />
Steps must be taken to maintain the state <strong>of</strong><br />
the page<br />
◦ Otherwise the values <strong>of</strong> variables and controls on<br />
the page will be lost in every postback<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-29<br />
ASP.NET can retain and redisplay control<br />
contents<br />
Web controls have an EnableViewState<br />
property<br />
◦ Set to true by default<br />
◦ Indicates to the server to send the control’s<br />
contents back with the page<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-30<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 10
CIS 3260 – Intro to Programming in C#<br />
Local variables work the same in a Web or<br />
Windows application<br />
Class-level variables are lost unless steps are<br />
taken to save them<br />
Store the value <strong>of</strong> a class-level variable in a<br />
control on a Web page<br />
◦ EnableViewState property holds the value during<br />
postback<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-31<br />
Set up a control with its Visible property set<br />
to false or use the HiddenField control<br />
Assign the class-level variable to the<br />
invisible control<br />
◦ For a hidden field, use the (string) Value property<br />
// Declare a class level variable.<br />
private decimal discountTotalDecimal;<br />
protected void submitButton_Click(object sender, EventArgs e)<br />
{<br />
// . . . Calculations omitted.<br />
discountHiddenField.Value = discountTotalDecimal.ToString();<br />
}<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-32<br />
The Page_Load event occurs many times<br />
(during each postback) in a Web application<br />
IsPostBack property is set to false for an<br />
initial page load and true for all page loads<br />
following the first<br />
Test for IsPostBack == false to perform<br />
initialization tasks<br />
Test for IsPostBack == true to perform<br />
tasks only on postback<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-33<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 11
CIS 3260 – Intro to Programming in C#<br />
One instance <strong>of</strong> the Session object exists for<br />
each user <strong>of</strong> an application<br />
◦ Use to store information about the user on the<br />
server<br />
◦ Each time a user accesses an application, a Session<br />
object is created with a unique SessionID<br />
◦ Session values are maintained as long as the<br />
session exists<br />
• Sessions can time out, terminate or users can logout<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-34<br />
Drawbacks to session objects<br />
◦ <strong>Information</strong> is stored on server<br />
• Large amounts <strong>of</strong> data for multiple users can bog<br />
down the server<br />
◦ Web sites split server loads among several systems<br />
(Web Farm)<br />
• State information might be on a different server than<br />
where the postback originates<br />
• .NET handles this problem by specifying the name <strong>of</strong> the<br />
machine that stores the session values in the Web.config<br />
file<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-35<br />
Use the Contents collection <strong>of</strong> the Session<br />
object to store values in code<br />
Each item in the collection is a key/value pair<br />
◦ Make up a name (the key) and assign a value<br />
Clear all session variables by using the<br />
Session.Clear method<br />
McGraw-Hill © 2010 The McGraw-Hill Companies, Inc. All rights reserved. 9-36<br />
Dr. David McDonald <strong>Chapter</strong> 9 – Page 12