BIS 450 DeVry Week 5 iLab 5
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
<strong>BIS</strong> <strong>450</strong> <strong>DeVry</strong> <strong>Week</strong> 5 I Lab 5<br />
Downloading is very simple, you can download this Course<br />
here:<br />
http://mindsblow.us/question_des/<strong>BIS</strong><strong>450</strong><strong>DeVry</strong><strong>Week</strong>5<strong>iLab</strong>5/<br />
4403<br />
Or<br />
Contact us at:<br />
help@mindblows.us<br />
<strong>BIS</strong> <strong>450</strong> <strong>DeVry</strong> <strong>Week</strong> 5 <strong>iLab</strong> 5<br />
<strong>BIS</strong><strong>450</strong><br />
<strong>BIS</strong> <strong>450</strong> <strong>DeVry</strong> <strong>Week</strong> 5 <strong>iLab</strong> 5<br />
<strong>iLab</strong> 5 of 8: Maintaining the Food Information Guide Database<br />
Submit your assignment to the Dropbox located on the silver tab at the top of this page.<br />
(See Syllabus/”Due Dates for Assignments & Exams” for due dates.)<br />
i L A B O V E R V I E W<br />
Scenario/Summary<br />
You have been asked to add a form to the Healthy Eating Web site that will allow an administrator to maintain the<br />
database used by the Food Information Guide feature.<br />
You will create an ASP.NET Web form to allow the administrator to find, view, edit, and delete food records, as well as<br />
add new food records to the Microsoft Access database.<br />
Although you will create the Web form for this lab in a folder named “Secure”, you will not actually restrict access to the<br />
folder to administrators only at this time. That will be performed in a future <strong>iLab</strong>.<br />
Deliverables<br />
1. Maintain Food Information Web form (Secure/Admin.aspx) added to the Healthy Eating Web site on the Web server.<br />
2. Word document submitted to Dropbox with screenshots of Maintain Food Information Web form displayed in browser<br />
(Your Name <strong>BIS</strong><strong>450</strong> Lab5 Screenshots.docx). Screenshots must show the complete browser window including the<br />
URL of the page.<br />
• Screen shot showing display of an existing record.<br />
• Screen shot showing adding a new record.<br />
• Screen shot of new record after a successful add.<br />
• Screen shot showing editing a record.
• Screen shot of updated record after a successful edit.<br />
Grading Rubric<br />
Criteria Points %<br />
Step 2: Create Maintain Food Information Web Form (Secure/Admin.aspx)<br />
• Secure folder created on the web server<br />
• Admin.aspx created in Secure folder<br />
• Has standard page header, navigation menu, and page footer<br />
• Form title “Maintain Food Information” in bold<br />
• Input controls: Textbox for food<br />
• Button for Find Food Info<br />
• AccessDataSource control<br />
• DetailsView control 10 40%<br />
Step 3: Configure AccessDataSource Control<br />
• Connected to HealthyEating.mdb in database folder<br />
• Retrieves NDB_No, Food, Amount, and Calories columns from Foods table<br />
• Parameter query with LIKE operator bound to txtFood textbox<br />
• INSERT, UPDATE and DELETE statements 5 20%<br />
Step 4: Configure DetailsView Control<br />
• Bound to AccessDataSource control on form<br />
• Displays columns NDB_No, Food, Amount, Calories<br />
• Classic AutoFormat applied 5 20%<br />
Step 5: Test, Capture Screenshots, and Submit (Student Name <strong>BIS</strong><strong>450</strong> Lab5 Screenshots.docx)<br />
• Word file submitted to dropbox with the following screen shots:<br />
o Fourth “beets” record displayed in DetailsView<br />
o In process of adding a record<br />
o Showing new record after successful add<br />
o In process of editing a record<br />
o Showing updated record after a successful edit 5 20%<br />
Total 25 100%<br />
i L A B S T E P S<br />
STEP 1: Open Web Site on the <strong>DeVry</strong> Web Server<br />
1. Launch Microsoft Visual Studio 2010.<br />
You must use Visual Studio 2010 in the Citrix environment.<br />
2. Pull down the File menu and select Open, then select Web Site. In the Open Web site dialog, select FTP Site in the<br />
left column. The connection information you used in the previous lab should be displayed:<br />
• Server: bisweb.devry.edu<br />
• Port: 21
• Directory: coursefolder/yourname, where coursefolder = folder on the web server for your course (provided by your<br />
professor), and yourname = your first initial and last name, (e.g. jsmith for student John Smith).<br />
• Passive Mode and Anonymous Login: Both unchecked.<br />
• Username: acadDnnnnnnnn, where Dnnnnnnnn = your DSI number.<br />
• Password: Enter the same password as you use for Citrix <strong>iLab</strong> (must be re-entered each time).<br />
Click Open.<br />
STEP 2: Create Maintain Food Information Web Form<br />
1. In the Solution Explorer window, click on the Web site root (ftp://bisweb.devry.edu/coursefolder/yourname) to select<br />
it; then pull down the Website menu and click New Folder. Enter Secure as the name of the new folder.<br />
2. In the Solution Explorer window, click on the Secure folder to select it; then add a new Web form named Admin.aspx<br />
to the folder.<br />
TIP: Putting this page in a separate folder on the site will make it easier to restrict its use to administrators only, later.<br />
3. Set the Title property of the Document to Maintain Food Information.<br />
4. Attach StyleSheet.css to the Web form. (Remember that since the page you are working on is inside the Secure<br />
folder, you will have to navigate up one level in the Select Style Sheet dialog to locate StyleSheet.css.)<br />
5. Because this form will use several elements that were also used in the Food Information Guide form, it will be more<br />
efficient to copy the body of that form as a starting point, rather than copy from Default.htm as we have done in some<br />
earlier <strong>iLab</strong>s. Open FoodInfo.aspx and copy the contents of its<br />
element (in HTML, everything between the<br />
?????? ?????<br />
and<br />
????? ?????<br />
tags, but not the<br />
?????? ?????<br />
and<br />
????? ?????<br />
tags themselves). Paste these contents inside the div in Admin.aspx (in HTML, in between the<br />
and<br />
tags).<br />
6. Change the “Food Information Guide” heading to read Maintain Food Information.<br />
7. Delete the GridView control.<br />
8. Drag a DetailsView control from the Data section of the Toolbox and drop it onto the form where the GridView control<br />
was. Select and drag the right edge of the control to stretch it across the form.<br />
Your Web form should now look like the following in Design View:<br />
9. Save the Web form.<br />
STEP 3: Configure AccessDataSource Control<br />
1. Click the AccessDataSource1 control and, if necessary, click the > button in the upper right corner to display the<br />
control’s smart tag. Click the Configure Data Source task in the smart tag.
2. In the first screen of the Configure Data Source wizard, add ../ in front of the Microsoft Access data file, so that it<br />
reads in full ../database/HealthyEating.mdb (this is the correct relative path to the database file from inside the Secure<br />
folder). Then click Next >.<br />
TIP: As in last week’s <strong>iLab</strong>, typing in the path to the database file works more reliably than browsing to the database,<br />
given the way your personal site on the Web server is configured.<br />
3. In the second screen of the Configure Data Source wizard, select the Specify columns from a table or view option.<br />
In the list of columns, place checks beside NDB_No, Food, Amount, and Calories. Click the WHERE… button.<br />
TIP: In the previous lab, NDB_No was not selected because it was not meaningful to display it to the user. It is selected<br />
in this week’s lab because you will be allowing the user to update as well as view the records in the table. When a data<br />
source will be used for updates, the primary key of the table must always be selected.<br />
4. In the Add WHERE Clause dialog, select Food from the Column drop-down list. Select LIKE from the Operator dropdown<br />
list. Select Control from the Source drop-down list. Under Parameter Properties, set the Control ID to txtFood.<br />
Click the Add button and review the SQL WHERE clause expression that the wizard has built. Click OK.<br />
5. Back on the Configure the Select Statement screen of the Configure Data Source wizard, click the Advanced button.<br />
In the Advanced SQL Generation Options dialog, check the option Generate INSERT, UPDATE, and DELETE<br />
statements. (These extra SQL statements are needed because you want to allow the administrator to add, edit, and<br />
delete records through this data source.) Click OK.<br />
TIP: Although it is very convenient to have Visual Studio generate the INSERT, UPDATE, and DELETE statements for<br />
you, unfortunately it does not always do so correctly! So, you should always check the generated statements to be sure<br />
they are correct. In this lab, you will be checking and correcting these statements in a later step. This is why, even with<br />
“smart” tools like Visual Studio, it is still important to know the basics of SQL.<br />
6. Click Next > to move to the next screen of the Configure Data Source wizard.<br />
7. On the Test Query screen of the Configure Data Source wizard, click Test Query.<br />
In the Parameter Values Editor, enter apple in the Value column and click OK.<br />
You should see a list of foods containing the word “apple”, with their NDB_Nos, amounts and calories. Click Finish.<br />
8. Now you need to check for errors in the INSERT, UPDATE, and DELETE SQL statements that you asked the<br />
configuration wizard to generate for you earlier. Click the AccessDataSource control to make sure it is selected. In the<br />
Properties window, click the InsertQuery property and then click the button with three dots […] that appears. The<br />
INSERT command should look like this:<br />
This is correct, so click Cancel without making any changes.<br />
9. To check the UPDATE command, click the UpdateQuery property and then the […] button. The UPDATE command<br />
that the wizard generated may look like this:<br />
Unfortunately, this is NOT quite correct; there is some extra “junk” code in the WHERE clause. Carefully select the part<br />
of the statement that is highlighted in the above image and delete it. Take care to delete only one of the two closing<br />
right parentheses. After you delete the “junk” your UPDATE command should look like:<br />
Click the OK button to save your changes to the UPDATE command.<br />
10. To check the DELETE command, click the DeleteQuery property and then the […] button. The original DELETE<br />
command looks like:<br />
Delete the highlighted “junk” portion, again taking care to delete only one of the two closing right parentheses. The<br />
resulting command should be:<br />
Click the OK button to save your changes to the DELETE command.<br />
11. Save the Web form.<br />
STEP 4: Configure DetailsView Control<br />
1. Click the DetailsView control to select it. If necessary, click the > at the upper right to display the control’s smart tag.<br />
2. Beside Choose Data Source, select AccessDataSource1. Check the boxes for Enable Paging, Enable Inserting,<br />
Enable Editing, and Enable Deleting. Click Auto Format.
3. In the AutoFormat dialog, choose the Classic scheme and click OK.<br />
Your Web form should now look like this in Design View:<br />
4. Save the Web form.<br />
STEP 5: Test, Capture Screenshot, and Submit<br />
1. To test the Food Information Guide form, in the Solution Explorer window, right-click on Admin.aspx and select View<br />
in Browser. Initially your form should look like this:<br />
2. Enter beets in the textbox and click the Find Food Info button. You should see the following display:<br />
3. The numbers at the bottom of the DetailsView control indicate there are 9 records in the database containing the<br />
word “beets.” Unlike the GridView, which showed all matching records at once, the DetailsView shows only one at a<br />
time. Click on some of the numbers to display different records.<br />
4. Capture a screen shot of your Web form with the fourth record containing “beets” displayed. Be sure to include the<br />
full browser window with the URL of the page. Paste this into a Word document.<br />
5. To test entering a new record, click the New button. A blank form should be displayed. For the NDB_No, enter 98765.<br />
For the Food value, enter YourName and a food item. (For example, if your name is Jane and you like cupcakes, enter<br />
Jane’s Cupcakes.) Enter an amount for consumption and a calorie count for the amount. Capture a screen shot showing<br />
your entry and paste it into the same Word document. Then click Insert.<br />
6. Enter the food you just added (YourName’s YourFood, e.g. Jane’s Cupcakes) in the Find Food textbox and click<br />
Find Food Info. The food record you added should be displayed. Capture a screen shot of this and paste it into the<br />
same Word document.<br />
7. To test editing a record, click the Edit button. The record should be displayed for editing. Notice that NDB_No, the<br />
primary key, cannot be changed. Change the Amount to 1 oz and the Calories to 456. Capture a screen shot and paste<br />
it into the same Word document. Click Update.<br />
8. Capture a screen shot showing your record displayed after completing the update, and paste it into the same Word<br />
document.<br />
9. To test deleting a record, click the Delete button. The record should disappear from the screen. Try clicking the Find<br />
Food Info button to search for your food again. Nothing should be displayed, indicating the record was deleted.<br />
10. Save your Word document containing 5 screenshots as Your Name <strong>BIS</strong><strong>450</strong> Lab5 Screenshots.docx. (Make sure<br />
that the browser URL is visible in all your screenshot.) Submit this file to the <strong>Week</strong> 5 <strong>iLab</strong> Dropbox