BIT 285: ( Web) Application Programming Lecture 05: Tuesday, January 20, 2015 Breakpoints, Watches & Locals, Exceptions, Page, Request & Response, Moving.

BIT 285: (Web) Application Programming

Lecture 05: Tuesday, January 20, 2015

Breakpoints, Watches & Locals, Exceptions,Page, Request & Response, Moving Between Pages with C#,

Sending Data Between Pages

Instructor: Craig Duckett

2

JUST A HEAD'S UP: Assignment 1: Web Forms is due Tuesday, February 3, (zipped and uploaded to StudentTracker by midnight)

StudentTracker is up-and-running on a brand-new location in the "cloud" so you will have to set up a new account if you haven't done so already.

A Note About Email

I've set up a proprietary [email protected] account specifically for returning graded files from StudentTracker. Depending on your email account (like gmail), you may getting a warning similar to this:

This email is indeed coming from me, and can be safely ignored.

PLEASE NOTE: If you need to contact me please do not reply to the gmail message from StudentTracker, but write to me instead using my college [email protected] email account address. As I explained, this gmail account is a proprietary account I set up solely for sending assignments to and from StudentTracker and I only check it for email messages a couple of times a month.

So: if you have a question or comment about BIT115 or your assignments, and you would prefer getting a timely reply, please contact me using my Cascadia email, or you may be waiting for a long long loooong while before receiving an answer. Thanks!

mailto:[email protected]

4

Breakpoints

5

Using Breakpoints

The topics that follow introduce you to the basic techniques for using the Visual Studio debugger to debug an ASP.NET application. Note that these techniques are almost identical to the techniques you use to debug a Windows application. If you've debugged Windows applications, then, you shouldn't have any trouble debugging web applications.

You can set a breakpoint before you run an application or as an application is executing. Remember, though, that an application ends after it generates a page. So if you switch from the browser to Visual Studio to set a breakpoint, the breakpoint won't be taken until the next time the page is executed. If you want a breakpoint to be taken the first time a page is executed, then, you'll need to set the breakpoint before you run the application. After you set a breakpoint and run the application, the application enters break mode before it executes the statement that contains the breakpoint.

In some cases, you may want to set more than one breakpoint. You can do that either before you begin the execution of the application or while the application is in break mode. Then, when you run the application, it will stop at the first breakpoint. And when you continue execution, the application will execute up to the next breakpoint. Once you set a breakpoint, it remains active until you remove it. In fact, it remains active even after you close the project.

6

Using Breakpoints CONTINUED

How to Set and Clear Breakpoints

• To set a breakpoint, click in the margin indicator bar to the left of the statement at which you want the break to occur. The statement will be highlighted and a breakpoint indicator (a red dot) will appear in the margin (see screen cap on next slide). You can set a breakpoint before you run an application or while you're debugging the application.

• To remove a breakpoint, click the breakpoint indicator red dot. To remove all breakpoints at once, use the Debug > Delete All Breakpoints command.

• To disable all breakpoints, use the Debug > Disable All Breakpoints command. You can later enable the breakpoints by using the Debug > Enable All Breakpoints command.

• To display the Breakpoints window, use the Debug > Windows > Breakpoints command. Then, you can use this window to go to, delete, enable, disable, label, or filter breakpoints.

When ASP.NET encounters a breakpoint, it enters break mode before it executes the statement on which the breakpoint is set. Note, however, that can't set breakpoints on blank lines.

7

Using Breakpoints CONTINUED

8

WALK THROUGH: Using Breakpoints CONTINUED

1. Download and unzip the breakpointdemo.zip from the Lecture 5 Example Files

2. Using Visual Studio, open the breakpointdemo Web Site

3. Run the program to set what it does, then click the Stop Debugging red square (or hit Shift+ F5)

4. Open the Default.aspx.cs code-behind file in Source view

5. Right-click on the line of code highlighted in the screen cap below and select Breakpoint > Insert Breakpoint

6. The line is now highlighted in red, and a red dot appears in the margin bar to the left. This indicates that a breakpoint is present.

9


7. Run default.aspx in Debug mode

8. Click on the button, and all is well, but when you click on the calendar you should automatically be brought to Visual Studio with the breakpoint line you added previously now highlighted in yellow (your web application is now paused where you set the breakpoint).

9. You can quickly check the property of any of the values by hovering your mouse over them.

10


10. Although it's useful to see the values of properties at your breakpoint, it's even more useful to be able to step through your code line-by-line and see what is affected.

Click Debug > Step Over

This is particularly useful when you have several breakpoints set (one not just one as in this example)

11

Watches and Locals

12

The Watch and Locals Windows CONTINUED

Previously we learned how to pause an application at certain points in order to inspect the current state of controls and values. However, using that technique only allows us to inspect the values of objects that the code directly refers to.

Using the Watch and Locals windows, you can inspect any values that are available, regardless of whether or not the code makes reference to them.

1. If it is not already open, open the breakpointdemo Web Site

2. Open the Default.aspx.cs code-behind file in Source view

3. If it is not already set, set a breakpoint on the calendar SelectionChanged line of code

4. Start debugging, click on the calendar, and then when it breaks back to Visual Studio click the Locals button at the bottom of the screen. Locals contains all of the properties that are currently available to your code in a tree structure. NOTE: It’s not the easiest way to find what you’re looking for, but it always contains every value that is available to your application.

13


14


5. The Watch window works very similarly to the Locals window, but you can choose the values that you want to appear in it. It’s usually a much more convenient way of inspecting values in your application.

6. Stop and start debugging again. Click the Watch button at the bottom of the window to bring up the Watch window.

7. Drag your mouse cursor of the yellow highlighted text of the breakpoint, right-click on Label1.text in the code and select Add Watch from the shortcut menu

8. Label1.Text and its current value appear in the Watch window.

9. You can delete any watch from the Watch window by right-clicking on it and selecting Delete Watch

You can add multiple items to watch in the Watch window.

15

The Exception Object

16


So far all of our code may have run without any problems, but unfortunately this won’t always be the case. When things do go wrong—and they will, often!—Visual Studio will do its best to tell you what the problem is. Exceptions appear when something goes wrong while the code is running. By looking at the exception, you will hopefully be able to work out what the problem is.

1. Download and unzip the exceptiondemo.zip from the Lecture 5 Example Files

2. Using Visual Studio, open the exceptiondemo Web Site

3. Run the program to set what it does, then click the Crash Me button.

You should be brought back to Visual Studio. If not, switch back to it manually without closing the browser window. The line that caused the exception is highlighted in yellow and a box has appeared showing the details of the exception (see screen cap on the next slide). This exception is very obvious . The error message at the top tells you that it was caused by attempting to divide by zero. Unfortunately not all error messages are this easy to understand.

17


18


4. You’ll notice that the Exception window shows a list of Troubleshooting tips. You can click on them to read articles relevant to the problem, which might help you to fix it.

5. You can also click Search for more Help Online... to be redirected to a search page which will allow you to search Microsoft’s articles for anything relevant.

6. View the details of the exception. An exception isn’t just an error message; it has properties, just like the controls on your page. Click the View Detail... link in the Exception box.

7. Expand System.DivideByZeroException by clicking the arrow. The most important properties of the exception are InnerException, Message, Source and StackTrace.

8. InnerException will contain another exception if this one had a deeper cause. Essentially, the Inner Exception is the exception that caused this one. Since this exception didn’t have a deeper cause, the Inner Exception is null.

9. Message is the error message that you’ve already seen displayed on the main exception box. 10. Source is the namespace that caused the error. 11. StackTrace shows the operation that caused the error. If you read it you’ll see that the first line tells you

that the error originated in _Default.ButtonCrash_Click.

19


Fix the Problem

12. This error happened because the number that the code divided by was zero. You can fix this by changing the number.

13. Click OK and stop debugging. Either close your web browser or click Debug > Stop Debugging. 14. Change the line int Denominator = 0; to int Denominator = 2; 15. View the page in Debug mode and click the Crash Me button. This time there are no errors. 16. Instead the result of 10 divided by 2 is displayed.

20

The Page Object Using Watch

21

The Page Object Using Watch

As we've talked about briefly (and will talk about in more depth in the next lecture, Lecture 6) , every .aspx page has an object behind it called the Page object which contains a lot of useful properties about the status of the page. In this example you’ll inspect the Page object and view some of the more important parts of it.

1. Open the breakpointdemo website again and remove any breakpoints and watches in the code-behind file.

2. Add a breakpoint to the Button code.

3. Run the program, and press the button; when the program breaks back to Visual Studio we are going to manually add a watch for the Page object.

22

The Page Object Using Watch CONTINUED

4. Click in an empty box under Name in the Watch window, and type Page in the box, then hit Enter. A watch is created for the Page object.

5. Expand the Page object to view its properties by clicking the '+' sign next to it in the Watch window. As you can see the Page object has an overwhelming number of properties, most if which won't make much sense at the moment. The Page object can be thought of as a container for absolutely everything on an ASP.NET page.

23


6. Collapse the Page object by clicking the minus sign '-' next to Page.

7. In the same way you did for Page, add a watch for Page.Controls.

8. Expand Page.Controls

9. You can see the count property is 5, because Page.Controls is a collection containing 5 controls (we'll learn about Collections in a later lecture).

24


10. The Page object has a FindControl method that allows you to easily find a control on the page. Add the following watch to the Watch window:

Page.FindControl("Label1")

The Label1 control is found within the Page object and its Text property is displayed. The controls in the Page object are contained in the Page.Controls collection, but FindControl makes it easy to locate a specific control.

Of course we don’t need to use Page.FindControl under normal circumstances. We’ve only done this to illustrate that everything we add to a page becomes part of the Page object. We’ll examine some other important parts of the Page object next as well as in the next Lecture.

25

Request and Response

26

The Page.Request and Page.Response Objects

On 'plain' HTML web pages , a web browser sends a request to a web server and the web server responds by sending back the page’s HTML code. ASP.NET works in-between receiving the request from the browser and sending the response back to them, and you can see this in action by inspecting the Page.Request and Page.Response objects.

1. Download and unzip the requestresponsedemo.zip from the Lecture 5 Example Files

2. Using Visual Studio, open the requestresponsedemo Web Site


4. Open the Default.aspx.cs code-behind file in Source view.

27


5. Add a breakpoint to the Page_Load event handler . You might be wondering how to add a breakpoint to an event handler that doesn’t have any code in it; Visual Studio will not allow you to add a breakpoint to a blank line. Instead, set the breakpoint on the line with the closing squiggle } on it.

6. Run the program in Debug mode. Your code should be paused almost immediately , as the breakpoint is reached as soon as the page loads.

7. Clear any existing watches and add a watch for Page.Request .

28


8. The Page.Request object contains all of the information that was sent to the web server by the visitor to the page.

Expand Page.Request and find UserAgent in the properties list. The UserAgent property tells you which browser the visitor is using.

9. Examine some of the other properties of Page.Request.

• UserHostAddress shows the IP address of the visitor (127.0.0.1 or ::1 means it is your own machine).

• Url shows the web address that the visitor entered to get to this page.

29


10. Stop debugging and remove the breakpoint.

11. Run Default.aspx in Debug mode. You can see that it is filled with 'Lorem Ipsum' text.

12. Stop debugging and return to the code-behind file of Default.aspx.

13. Add the following code to the Page_Load() event handler:

Page.Response.Write("Atin-Lay Ucks-Say!"); Page.Response.End();

14. Run Default.aspx in Debug mode. The big block of text that was on the page has disappeared and has been replaced by Atin-Lay Ucks-Say!

This happened because we ended the page’s response to the visitor early by using Page.Response.End. If we hadn’t ended the response, the web server would have gone on to add the page’s content to the response.

30


By using Page.Response.Write , as we did in this example, we can add content directly to the web server’s response without it being on the .aspx page at all. This is useful for testing and debugging purposes, but it is better practice to use controls on the page to display content.

ASP.NET allows us to ‘listen’ to the user’s Request and modify the web server’s Response appropriately.

In practice we will rarely need to access the Page.Request and Page.Response objects directly as ASP.NET does most of the work for us.

For example, when the user clicks a Button control, it is reflected in the user’s Request to the web server. The web server then automatically runs the Button control’s Click event handler which may modify the Response by changing the properties of controls.

31

Moving Between Pages with C#

Moving Between Pages

32


1. Download and unzip the movingpagesdemo.zip from the Lecture 5 Example Files

2. Using Visual Studio, open the movingpagesdemo Web Site.

3. Inspect the page1.aspx code-behind file. There is a redirect attached to the Button click event:

4. Run the program to set what it does. Invoke the link to go to the Other Page, then go back with the browser and invoke the button. They do the same thing!

33

Moving Between Pages with C#5. Stop debugging.

6. Go back into the page1.aspx.cs file and replace the redirect with the following line of code:

7. Initially, at first glance, it appearance as if they are doing the same thing again, but this is certainly not the case! Look at the address bar. When you invoke the link you are taken here:

but when you invoke the button you are taken here:

34


Using the button, the browser still thinks that you’re on page1.aspx!

This is the major difference with Server.Transfer. It switches to the new page internally, but does not tell the browser! From the perspective of the person viewing the site, they haven’t changed pages at all.

Using Server.Transfer also keeps a reference to the previous page, as we’ll see in the last series of slides.

35


36

Sending Data Between PagesSo far we've learned how to retrieve data from a page, access the properties of controls and transfer between pages, but we’ll often want the site to remember something that the user has entered on a previous page after they move to a new page. In this example we’ll learn a few of the ways to send data from one page to another.

1. Download and unzip the passdatademodemo.zip from the Lecture 5 Example Files

2. Using Visual Studio, open the passdatademo Web Site


4. This code retrieves the TextBoxText control from the passdata1.aspx page and displays its Text property in the Label control on the passdata2.aspx page (so why does it still say passdata1.aspx?). It probably looks a little confusing at the moment. You won’t be able to fully understand this code until we slogged through a few more lectures.

• Page.PreviousPage is a link to the Page object you came from.

• FindControl("TextBoxText") looks for the TextBoxText control on the previous page.

37


Sending Data Using QueryString

The QueryString method is the most widely used method of sending data between pages. While browsing the Internet, you might have noticed that sometimes web addresses look something like:

www.[site].com/[page].aspx?page=10&product=13

The values after the question mark are Query String values, and you can use them to send data between pages.

1. Open the code-behind file of passdata1.aspx.

2. Replace the Page.Server.Transfer line of code with:

Page.Response.Redirect ("passdata3.aspx?text=" + TextBoxText.Text);

38


3. If you look at the address bar, you can see how the text was sent to passdata3.aspx

4. Close your browser and view the code-behind file of passdata3.aspx. Here you can see that the text was retrieved using Page.Request.QueryString.

39

Suggested Links of Interest

• How to Debug an ASP.NET Web Application (MSDN)

• ASP.NET Debugging (TutorialsPoint)

• How to Pass Data Between ASP.NET Pages (Microsoft)

• Five Ways to Send Data Between ASP.NET Pages (Itorian)

• Data Transfer Between Two ASP.NET Pages (Rami Vemula)

https://support.microsoft.com/kb/316726/EN-US

http://www.tutorialspoint.com/asp.net/asp.net_debugging.htm

http://msdn.microsoft.com/en-us/library/6c3yckfw(v=vs.140).aspx

http://www.itorian.com/2012/07/5-ways-to-send-data-between-aspnet-pages.html

http://www.intstrings.com/ramivemula/asp-net/data-transfer-between-two-asp-net-pages/

40

Lecture 05: In-Class ExerciseFrom the menu bar, select Lectures and go to the Lectures 05 bar and select Lecture 05 ICE to begin working on today's in-class exercises.

BIT 285: ( Web) Application Programming Lecture 05: Tuesday, January 20, 2015 Breakpoints, Watches & Locals, Exceptions, Page, Request & Response, Moving.

Documents

breakpoint indicator

aspnet application

breakpoint wont

breakpoint befor

gmail account

proprietary account

email account address

new account