| | Help and How-to Training Related Products and Technologies Support and Feedback Technical Resources Additional Resources | Warning: You are viewing this page with an unsupported Web browser. This Web site works best with Microsoft Internet Explorer 6.0 or later, Firefox 1.5, or Netscape Navigator 8.0 or later. Learn more about supported browsers.
Display a picture using a database you create by using FrontPage
Using Microsoft FrontPage, you can create a database, and then use it with a Web page to display pictures. This is useful for creating Web pages that show data and images together, as with employee records that contain photographs.
Create the database
- On a new page in a server-based web site, insert a form by clicking the Insert menu, pointing to Form, and then clicking Textbox.
So the insertion point stays where the text box was just inserted, do not click anywhere on the page.
- Move your cursor to the Insert menu, point to Form, and then click Textbox.
There should be two text boxes next to each other on the page.
- Double-click the first text box, and then type the word Description in the Name box.
-
Double-click the second text box, and then type the word Image in the Name box.
- On the file menu, click Save As, type ASPsample.asp in the File name box, and click Save.
- Right-click the form, and then click Form Properties on the shortcut menu.
- Click Send to database, and then click Options.
- On the Database Results tab, click Create Database.
When you see a message that FrontPage has successfully created a database, click OK.
- Click the Additional Fields tab. Select each field, and then click Remove.
- Click OK twice, and then save the page.
- Click Preview in Browser
.
- When the page opens in Microsoft Internet Explorer, type values in the Description and Image fields
Use a description and name of a real photo you want to display. Use the format file.jpg or file.gif for the image file name.
- Click Submit.
- Return to FrontPage and select the images folder. Import the image that you just entered in the form using Internet Explorer.
How
- On the File menu, click Import.
- In the Import dialog box, click Add File.
- Click Browse to find the image on your hard disk, and then click Open.
- Click OK to import the files that are on the Import list.
Note You will need to add image names and descriptions, as described in the previous step, for each image you want to display.
Note The database fields Image and Description are used here for example purposes. You can use different names if you want, but be consistent. Create the display page
- On a new page, start the Database Results Wizard by clicking the Insert menu, pointing to Database, and then clicking Results.
- Under Use an existing database connection, choose ASPsample. Click Next to get to Step 3 of the wizard.
- In Step 3 of the wizard, click Edit List.
- In the Displayed Fields dialog box, click to select all fields except Description and Image, and then click Remove.
- Click OK, and then click Next to get to Step 5 of the wizard.
- In Step 5 of the wizard, choose a display option:
- To show all photos together on one page, select Display all records together.
- To specify the number of photos to show on a page, click Split records into groups.
- Click Finish.
- In Page view, delete the database column value representing the image. It will look like this: <<Image>>.
- In the Folder List, expand the images folder, select the image you imported earlier, and drag it to the place you deleted the <<Image>> column value.
- Right-click the image, and then click Picture Properties.
- On the General tab, under Picture Source, click Parameters.
- In the Path field, leave the current path, but remove the file name.
- Click Insert Field Value, and then select Image.
- Click OK to close the dialog boxes.
The small broken image icon represents where the actual image will appear when the page is viewed in a Web browser.
- Click the Preview in Browser button, and make sure to save the page with an .asp extension.
Notes
|