Let's take a look at the HTML tags required to create this form. Using straight HTML we can create the buttons and text box. Each and every browser will be able to create these. So when the user logs into your site, they receive this HTML page and the browser creates the form to display.
1. Open Notepad and create a new file called request.htm. Save the file in the \Chapter13 directory. Now, please add the following code to this file:
<HTML>
<HEAD>
<TITLE>Request information from the server</TITLE>
</HEAD>
<BODY>
<H1><FONT size="5">Please enter the Publisher's ID</FONT></H1>
<HR>
<FORM NAME="request" Action="Results.asp" method="POST">
<P>Enter the ID
of the Publisher for retrieving titles:</P>
<BLOCKQUOTE>
<TABLE BORDER="0">
<TR>
<TD ALIGN="right"><I>Publisher ID</I></TD>
<TD><INPUT TYPE="text" size="25"
name="PubID"> </TD>
</TR>
</TABLE>
</BLOCKQUOTE>
<P><INPUT TYPE="submit" value="Submit PubID">
<INPUT TYPE="reset" value="Reset Form"> </P>
</FORM>
<HR>
<H5>Copyright: Programming Databases with Visual Basic 6.0.<BR>
Last revised: July 19, 1998</H5>
</BODY>
</HTML>Please be sure the file is saved and then enter the name of the file in your browser. Your final product should look like the example in the screenshot above.
The key to this is the FORM tag. This tag allows you to solicit user input by building HTML documents that contain fill-in forms. We are building a text box and two buttons, but you can also create check boxes, radio boxes, pull-down lists, and even menus:
<FORM NAME="request" Action="Results.asp" method="POST">
Essentially, the form will send the data to a particular program on the server, namely Results.asp that we have yet to write. Of course, in our examples the client and server happen to be on the same machine.
In our case, the data gathered from the user in the form will be sent to the server to invoke the Results.asp Active Server Page. So this line says that the name of our form is request, that we want it to call Results.asp, and that it will POST the data to the server. The server will take the information the user enters in the text box and grab the requested data from the database.
<P>Enter the ID
of the Publisher for retrieving titles:</P>Here, we just output some text to the user asking them to input the ID of the Publisher. Now we are ready to build the text input box that will accept the input from the user:
<BLOCKQUOTE>
<TABLE BORDER="0">
<TR>
<TD ALIGN="right"><I>Publisher ID</I></TD>
<TD><INPUT TYPE="text" size="25"
name="PubID"> </TD>
</TR>
</TABLE>
</BLOCKQUOTE>
To make the form nice and neat, we build a table with two elements. The first is the text "Publisher ID" We display the text "Publisher ID" between the <I> tags. <I> tells the browser to italicize any text between these tags.
The second table element is an INPUT TYPE="text" box of size = "25". We also give this text box the name "PubID". This serves to distinguish this text box from any others that might be on the form. Also, we will retrieve the information that the user submits in this text box at the server, when the form is posted.
Now we create two standard HTML buttons, a submit and reset button:
<P><INPUT TYPE="submit" value="Submit PubID">
<INPUT TYPE="reset" value="Reset Form"> </P>
</FORM>
HTML knows about these types of buttons, so we just define the input type as "submit" and give it the value (which is the caption) of "Submit PubID". The other button knows how to reset the fields in the form and has the caption "Reset Form". That's all we need to do to create these built-in types of buttons. The browser knows how to construct them when it receives this HTML code.
Not too bad. Please take a minute to digest the code above. It might look a bit strange if you are not familiar with HTML, but it will all start to make perfect sense shortly. So here we just created an HTML page that will get information from the user, who could be anywhere on the planet. The form will submit the client's request to the server. Now, let's move on to scooping up the request on the server and displaying the results to the client.
2. Please type the name of the request.htm form into your browser now. Be sure it looks like the example. Don't try and submit any information yet, or you will get the dreaded HTTP Error 404 - remember, we haven't built the server side code as yet. When you are satisfied with how the form looks, let's move on to the next step.