22.05.2017 Views

CIS 407 DeVry iLab 1 of 7 latest

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

<strong>CIS</strong> <strong>407</strong> <strong>DeVry</strong> <strong>iLab</strong> 1 <strong>of</strong> 7 <strong>latest</strong><br />

Downloading is very simple, you can download this Course here:<br />

https://www.mindsblow.com/product/cis-<strong>407</strong>-devry-ilab-1-7-<strong>latest</strong>/<br />

Or<br />

Contact us at:<br />

SUPPORT@MINDSBLOW.COM<br />

<strong>CIS</strong> <strong>407</strong> <strong>DeVry</strong> <strong>iLab</strong> 1 <strong>of</strong> 7 Latest<br />

<strong>CIS</strong><strong>407</strong><br />

<strong>CIS</strong> <strong>407</strong> <strong>DeVry</strong> <strong>iLab</strong> 1 <strong>of</strong> 7 Latest<br />

<strong>iLab</strong> 1 <strong>of</strong> 7: “Annual Salary Calculator” ASP.NET Web Application<br />

i L A B O V E R V I E W<br />

Scenario/Summary<br />

In this <strong>iLab</strong>, you will create an Annual Salary Calculator ASP.NET web application using Visual Studio.NET 2008. For<br />

the <strong>iLab</strong>s, you will use the Micros<strong>of</strong>t Visual Studio 2008 s<strong>of</strong>tware application. You have two options for using this<br />

application:<br />

<br />

<br />

<br />

You may use a copy <strong>of</strong> Visual Studio 2008 that is installed on your local PC. or<br />

You may run Visual Studio 2008 over the Web<br />

Throughout this course, you will be creating a web application for a fictitious company called CoolBiz<br />

Productions, Inc. To get familiar with the development environment, follow the Lab Steps to create a simple<br />

Annual Salary Calculator ASP.NET web application. You will be adding to this application each week.<br />

Instructions for Week 1 <strong>iLab</strong>:<br />

“Hello World, and more” ASP.NET Web Application<br />

Click on the link above to view the tutorial. Please watch this tutorial before beginning the <strong>iLab</strong>. The tutorial has audio.<br />

Overview <strong>of</strong> Fictitious Company<br />

CoolBiz Productions, Inc. We are a mid-size indie (independent) film studio that is in need <strong>of</strong> a payroll system. We have<br />

outgrown our current system, a simple spreadsheet, to the extent that it takes three people over one week to pay<br />

everyone on a timely basis.<br />

Overview <strong>of</strong> Our Company<br />

We have over 2,000 full-time and part-time employees.<br />

We produce comedy, fiction, and science fiction films with budgets <strong>of</strong> $250K–$20 million.<br />

We have produced over 50 films since we first began 20 years ago. We are very pr<strong>of</strong>itable and have strong links to<br />

many <strong>of</strong> the industry’s most powerful people.<br />

Current Payroll System<br />

Our current system consists <strong>of</strong> mostly manual processing using an MS Excel spreadsheet to control who gets paid.<br />

The system consists <strong>of</strong> the three payroll staff members reviewing each <strong>of</strong> the full-time staff members’ wages, calculating<br />

how many hours they worked based on their hourly rate, and paying them by issuing a check. The check needs to be


entered in another worksheet for each <strong>of</strong> the people who were paid so that we can tell when it went out, how much it<br />

was for, and if it was cashed or not. If a [Date_Cashed] is entered, we deduct that amount from our working payroll<br />

capital account to track how much money we have for payroll.<br />

This process is then repeated for all part-time staff and independent contractors.<br />

Our Needs<br />

We need a more automated way to pay our staff. We need to use the same logical flow as a basis, yet improve on it<br />

by having a way to<br />

1. easily calculate the projected annual salary based on rate and number <strong>of</strong> hours;<br />

2. search, enter, update, and delete staff and independent employee information in one place;<br />

3. search, enter, update, and delete payroll automation information for the employee to set up recurring payments<br />

or one-time payments;<br />

4. produce reports to show the following:<br />

a. summary <strong>of</strong> who got paid per week,<br />

b. summary <strong>of</strong> all payments per week,<br />

c. details <strong>of</strong> any employee to-date (allow entry <strong>of</strong> a specific employee ID);<br />

1. allow transactions to be rolled back in case we pay someone too much;<br />

2. make use <strong>of</strong> transaction processing in case the system unexpectedly shuts down;<br />

3. ensure the system is secure (logins required);<br />

4. allow only authorized payroll personnel to control all aspects <strong>of</strong> the system;<br />

5. allow only authorized payroll personnel to view transactions and user activity;<br />

6. allow only authorized payroll personnel to e-mail reports to users using the e-mail on file; and<br />

7. incorporate error handling into all processes in the system and e-mail any errors to the technical support<br />

people.<br />

Deliverables<br />

All files are located in the subdirectory <strong>of</strong> the website. The website should function as follows: You should have a page<br />

that, when run, displays a page showing the text “Hello, World.” You should also have a second page that is the annual<br />

salary calculator that properly calculates the annual salary, given an hourly rate and the number <strong>of</strong> hours projected to<br />

be worked in a year. Once you have verified both pages work, save your website, zip up all files, and submit in the<br />

Dropbox.<br />

i L A B S T E P S<br />

STEPS 1 through 3: Create Website and Home Page (10 points)<br />

In this ilab, we will learn how to create a simple ASP.NET web application using Micros<strong>of</strong>t Visual Studio.NET 2008. The<br />

application will display the text “Hello, World” on the home page.<br />

1. Open Micros<strong>of</strong>t Visual Studio 2008. Click on image to enlarge. Visual Studio Startup<br />

2. Click here for text description <strong>of</strong> this image.<br />

3. Create a new ASP.NET website called “PayrollSystem.” To do this, select “File, New Website.” Click here for text<br />

description <strong>of</strong> this image.<br />

When the “New Website” dialog opens, select “ASP.NET Website” as the Template, select “File System” as the<br />

Location, and select “Visual C#” as the Language. Click Browse and navigate to the folder where you want to save your<br />

website. Add “PayrollSystem” at the end <strong>of</strong> the file path. Click OK if you are prompted to create a new folder. Click OK<br />

in the New Website dialog to finish creating the website. Click on image to enlarge.<br />

New Website Dialog<br />

Click here for text description <strong>of</strong> this image.<br />

3. Edit the Default.aspx file (the home page for your site) to add the message “Hello, World.” To do this, if necessary,<br />

click the Design button below the editing window to switch to Design view, then click in the editing window and type<br />

“Hello, World” (without the quotes). Click on image to enlarge.


Edit in Design View<br />

Click here for text version <strong>of</strong> this image. Click the Save button on the toolbar to save the changes to Default.aspx.<br />

Click here for text description <strong>of</strong> this image.<br />

STEPS 4 through 5: Start Debugging (10 points);<br />

NOTE: Citrix users have different steps!<br />

4. To ensure that everything is working properly, click the Start Debugging button on the toolbar, or press the F5 key<br />

on the keyboard, or pull down the Debug menu and select “Start Debugging.” Click here for text description <strong>of</strong> this<br />

image.<br />

5. If the “Debugging Not Enabled” dialog box appears, select the option to add or modify the Web.config file to enable<br />

debugging and click OK. You should only have to do this the first time you debug the site. Click on image to enlarge.<br />

Enable Debugging<br />

6. Click here for text description <strong>of</strong> this image.<br />

NOTE: To execute the application, you have these options:<br />

A. If you are using Citrix, press CTRL + F5 to Start Without Debugging. You will not be deducted points for this part.<br />

B. If you are using a standalone version, press F5 to Start with Debugging, or you can press CTRL + F5 to Start Without<br />

Debugging<br />

STEP 6 through 7 : Display the “Hello, World” web page (10 points)<br />

6. The Internet Explorer web browser will open and display your Default.aspx page containing the “Hello, World”<br />

message. Click on image to enlarge. Hello World in Browser<br />

7. Click here for text description <strong>of</strong> this image.<br />

8. Stop debugging and return to the design mode by closing the browser.<br />

9. Add a new form to your web application called frmSalaryCalculator.aspx. Make sure “Place Code in separate file” is<br />

checked when you add the form. To add a new form, click (single-click, not double-click) on the project node in the<br />

solution explorer.<br />

With the project node highlighted, right-click on the project node and select “Add New Item” from the popup menu. The<br />

following dialog will be displayed:<br />

Select the name <strong>of</strong> the form you will add frmSalaryCalculator.aspx. Make sure “Place code in separate file” is checked<br />

and “Select master page” is unchecked.<br />

10. You will create a web-based salary calculator on this new page. To do this, open the aspx page in Design view and,<br />

from the Toolbox, add three labels, two text box controls, and a button control. You can add controls by dragging the<br />

control from the Toolbox – Standard section onto your form. Your form should look like this:<br />

11. Change the text displayed in each label so that the first label displays “Annual Hours”; the second label should<br />

display “Rate” and the third label should display “$”. (Hint: To change the text displayed, change the Text property <strong>of</strong><br />

each control.)<br />

12. Change the button text to display “Calculate Salary.” (Hint: To change the text displayed as the button label, change<br />

the Text property <strong>of</strong> the button.) Your form should now look like this:<br />

13. Set the ID property <strong>of</strong> the top text box to txtAnnualHours. Set the ID property <strong>of</strong> the second textbox to txtRate. Set<br />

the ID <strong>of</strong> the bottom label (the one we set the text property to “$”) to lblSalary. (Note: We set these IDs as we will be<br />

accessing the control values from the C# code. You can set the button ID and the other two labels’ ID properties as<br />

well, but we won’t be accessing them from our code.)<br />

14. In Design view, add a C# event handler for the button-click event by double-clicking on the Calculate Salary button.<br />

This will place you in the page code behind file the editor. (Remember that ASP.Net pages have a file containing the<br />

HTML markup with an extension <strong>of</strong> .aspx and a C# ‘code behind’ file with an extension <strong>of</strong> .aspx.cs.) This is the code<br />

that should be displayed: (If you changed the ID <strong>of</strong> the button, it will be a different method name.)<br />

Click here for text file <strong>of</strong> this image.


This code will be called each time the user presses the button. It is important to remember that code in the code behind<br />

page executes on the server – not on the user’s browser. This means that when the button is pressed, the page is<br />

submitted back to the web server and is processed by the ASP.Net application server on the web server. It is this code<br />

(between the { and } in this method) that will execute on the server. Once it is done executing the page will be sent<br />

back to the browser. Any changes we make to the page or controls on the page will be shown to the user in the updated<br />

page.<br />

15. In this method, add code that will get the text in the txtAnnualHours text box, convert it to a Double, and store it in<br />

a double variable. Add code that will get the text from the txtRate text box, convert it to a Double, and store it in another<br />

variable. Create a third variable <strong>of</strong> type Double and set its value to the annual hours variable value multiplied by the<br />

rate double variable value. Take this resulting value and convert it to a string (text), and update the lblSalary Text<br />

property with this new string.<br />

Hints:<br />

A control’s property can be accessed by simply using the control ID followed by a . followed by the name <strong>of</strong> the property.<br />

For example, the value stored in the Text property <strong>of</strong> the txtAnnualHours control can be accessed by using this:<br />

txtAnnualHours.Text. Text properties on controls are <strong>of</strong> type string.<br />

To convert a string to a Double you can use the Convert class. If we had a string variable called str1 and a double<br />

variable called myNumber, the C# code to convert this would be as follows: Click here for text file <strong>of</strong> this image.<br />

When converting from one type to another, we are assuming that the value stored in the type being converted is<br />

compatible with the type we are converting to. In the example above, if the value stored in str1 was not type compatible<br />

with a Double (for example “tiger”) an error would be raised.<br />

To set the value <strong>of</strong> a control on a web form, you can access the control and set the property directly. If I had a label<br />

control called lblCar and I wanted to update the text that was displayed in the label, I could do something like this:<br />

Click here for text file <strong>of</strong> this image.<br />

Note that following code would be incorrect and cause an error:<br />

Click here for text file <strong>of</strong> this image. lblCar is a Label – it isn’t a string so we can’t assign a string directly to it, but we<br />

can assign a string directly to the Text property <strong>of</strong> the label. All <strong>of</strong> the base types in C# (double, int etc) have a ToString()<br />

method you can call. If you had a double variable that you wanted to convert to a string and set that string to my label’s<br />

text, you would do the following:<br />

Click here for text file <strong>of</strong> this image.<br />

This would take whatever value was stored in the myNumber Double and convert it to a string. To add a $ to output<br />

you can use string concatenation in C# like this:<br />

Click here for text file <strong>of</strong> this image.<br />

16. Set your new form as the start page by clicking once on the form name in the Solution Explorer and then rightclicking<br />

on the form name and selecting “Set as Start Page.” You can now test your application and make sure it works<br />

correctly as you did with the Hello World form above. You can switch back and forth between which form runs when<br />

you run your application by setting the different forms as the start page.

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!