BIS 450 DeVry Week 4 I Lab 4

TIP: The database folder should have been created automatically when your personal Web folder was created. It has
the correct permissions assigned to allow ASP.NET to work with the database. The database file must be located in
this folder in order to work correctly.
2. Pull down the Website menu and select Add Existing Item.
3. In the Add Existing Item dialog, navigate to where you saved the HealthyEating.mdb database file that you
downloaded from Doc Sharing. (If you are working on the Citrix iLab server, and you saved the file on your local
computer, remember that your local computer’s disk drives are the ones with dollar signs $.) Select the
HealthyEating.mdb file and click Add.
You should now be able to see the HealthyEating.mdb file located under the database folder in the Solution Explorer
window. (You may need to click the + symbol beside the database folder to expand it, in order to see this.)
STEP 3: Create Food Information Guide Web Form
1. In the Solution Explorer window, click on the Web site root (ftp://bisweb.devry.edu/coursefolder/yourname) to select
it; then add a new Web form named FoodInfo.aspx to the site.
2. Set the Title property of the Document to Food Information Guide.
3. Attach StyleSheet.css to the Web form.
4. As you did when setting up the Web forms in the previous labs, open Default.htm and copy the contents of its element
(in HTML, everything in between the and tags, but not the and tags themselves). Paste these contents inside the div in
FoodInfo.aspx (in HTML, in between the
and
tags). Delete the contents of the #main div after pasting.
5. Inside div#main, type Food Information Guide as a heading for the form, followed by a blank line. Bold this heading.
6. Type the prompt Food:. To the right of this prompt, place a TextBox from the Standard section of the Toolbox. To
the right of the TextBox (on the same line), place a Button. Set the properties of each control as indicated below:
Control (ID) Text
TextBox txtFood
Button btnFindFood Find Food Info
7. Use the Enter key to move to the next line on the form. Drag an AccessDataSource control from the Data section of
the Toolbox onto the Web form. When you first place the AccessDataSource on the form, it will have a “smart tag”
labeled “Access Data Source Tasks” beside it. We will use this later when we configure the data source.
TIP: You can display or hide the smart tag by selecting the control and then clicking the < or=""> at the right corner of
the control.
8. Click to the right of the AccessDataSource control on the form and use the Enter key to move to the next line. Drag
a GridView control from the Data section of the Toolbox onto the form. If necessary, hide the smart tag (by clicking the
< button)="" and="" drag="" the="" right="" edge="" of="" the="" gridview="" control="" to="" stretch="" it="" across=""
the="">
Your Web form should now look like the following in Design View:
9. Save the Web form.
STEP 4: Configure AccessDataSource Control
1. Click the AccessDataSource1 control and, if necessary, click the > button in the upper right corner to display the
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, type database/HealthyEating.mdb in the Microsoft Access
data file box; then click Next >.
TIP: It is best to type in the path and name of the database file; clicking the Browse… button to select the database is
NOT recommended. If you do select the database by browsing, Visual Studio may insert a “~/” in front of the database