Visual Basic Concepts

Step Eight: Create the Detail.htm Page

You must now add a second HTML template to your project — the Detail page. This page differs from the Menu page you created earlier in that it contains replacement tags that will be populated with data each time the page is displayed. This allows you to use a single page over and over as different data records are displayed to the user. In Step Ten, you will write the code to process these tags and populate them.

For the sake of this tutorial, you can cut and paste the code shown below to create the necessary page.

To create the HTML template

  1. Open Notepad, then copy the following HTML into a new document. 
    <html><head><title>Customer Detail</title></head>
<body>
<h1>Customer Detail</h1><hr>
<table border="0" cellpadding="3" width="90%">
<tr valign="top">
<th>Contact Name:</th><td><wc@Name>Name</wc@Name></td>
<th>Company:</th><td><wc@Company>Company</wc@Company></td>
</tr>
<tr valign="top">
<th>Title:</th><td><wc@Title>Title</wc@Title></td>
<th>Email Name:</th><td><wc@Email>Email</wc@Email></td>
</tr>
<tr valign="top">
<th>Notes:</th><td><wc@Notes>notes</wc@Notes></td>
<th>Referred By:</th><td><wc@Refer>Refer</wc@Refer></td>
</tr>
</table>
<p><a href="WebClass1.ASP?WCI=Menu">Back to Main Page</a></p>
</body></html>

    Note   If you changed the NameInURL property of your webclass, you will need to replace Webclass1.ASP in the hyperlink shown above with whatever you named your webclass in this property.  For example, if you set the NameInURL property to Support, you would modify the line above to use Support.ASP as the name of the webclass.

  2. Save this page to your project directory and name it detail.htm.

To add the Detail page to the webclass

  1. In Visual Basic, open the Support project and click the Add HTML Template WebItem toolbar icon.

  2. In the Add HTML Template dialog box, click detail.htm, then click Open.

  3. Rename the new template to Detail.

    Note   If you look in your project directory, you will notice that there is now a file called detail1.htm. The webclass designer makes a copy of any template webitem you add and uses the copy instead of the original. That way, any changes made to the file do not affect your original.