A Textbox Field Example
Let's take a typical data entry form as an example. It may contain one or more text boxes to hold data that ends up within the database table. For example, suppose we have a text box to accept the user's first name that is actually linked to the field "first_name" within the database table. To build this, use the following HTML code:
<INPUT TYPE="text" NAME="first_name">
This would create a very simple, inelegant text box depending on your browser. The right way to do it is to specify its size, maximum length, and initial value if any. To make sure all text boxes appear neatly on your data entry screen, use the SIZE attribute. In addition, use the MAXLENGTH attribute to ensure the amount of data entered in the text box is not more than the size of the field in the database table. And finally, if the record in the database already contained a value for this field, you would pre-fill it in the text box using the VALUE attribute:
First Name: <INPUT TYPE="text" NAME="first_name" SIZE="60" MAXLENGTH="35" VALUE="">
We can now continue to put other controls underneath the first one to build our data entry screen. However, as we put double controls (label+textbox) underneath each other like this, their placement on screen will be out of order depending on the size of each label. It is better if they are placed in one row, within two columns of a two-column table, the label in the left column and the text box in the right column. Assuming we have created a table begin tag, the new code would be:
<TD ALIGN="RIGHT" VALIGN="TOP">First Name:</TD>
<TD ALIGN="LEFT" VALIGN="TOP"><INPUT
SIZE="60" MAXLENGTH="35" VALUE=""></TD>
This would provide us with a label and a text box in two neat columns. If we want 10 such controls, we would need to repeat the same code 10 times. This is where form-building code routines come in handy.
The Form Routines
|Figure 1. Sample HTML Form: Create a Forms routine that requires three separate SELECT tags.|
Instead of writing all the HTML code by hand, use the convenient Form routines. Suppose we plan to build the form in Figure 1
As you can see, it is a standard data entry form that accepts contact information. Most of the fields are pre-filled, possibly from a database, where the user has entered the data before, or the system already contains the information. This is also a very simple data entry form utilizing only text boxes.
Let's take this one step at a time. Suppose we just want to display the first nine controlsthe contact information text boxes. This would be the code:
WriteFormBegin "frmInfo", "pgApply.asp", _
"POST", "return ValidateForm(this);"
DisplayTextField "First Name:", "first_name", _
objRS("first_name"), 60, 35, True
DisplayTextField "Last Name:", "last_name", _
objRS("last_name"), 60, 35, True
DisplayTextField "Title:", "title", _
objRS("title"), 60, 80, False
DisplayTextField "Company:", "company", _
objRS("company"), 60, 80, True
DisplayTextField "Address:", "address_1", _
objRS("address_1"), 60, 80, True
DisplayTextField "", "address_2", _
objRS("address_2"), 60, 80, False
DisplayTextField "City:", "city", _
objRS("city"), 40, 35, True
DisplayTextField "State:", "state", _
objRS("state"), 40, 2, True
DisplayTextField "Zip:", "zipcode", _
objRS("zipcode"), 40, 10, True
DisplaySubmitButton "Submit", "cmd"
That's it. The above 14 lines of ASP code actually end up generating more than 100 lines of HTML code. As you can see, we call the "DisplayTextField" routine to automatically obtain a Label + Textbox combination. Let's see what each piece does.