The WebClient program from Listing 18.2 demonstrates one of the two fundamental capabilities of a Web client: the ability to download information from a Web server by issuing an HTTP GET request. Modern Web clients also have the capability to upload data to a Web server, using techniques referred to as the Common Gateway Interface (or CGI). CGI defines two methods for uploading data: GET and POST . The POST method is more powerful and secure than the GET method, which is not implemented by Java servlets. Therefore, we’ll omit discussion of using the GET method to upload data.
To use the POST method, you define an HTML page that includes tags that specify user
interface controls. Your page can include pushbuttons, input boxes, radio buttons, and so on. When the user clicks a designated submit button, the Web client uploads the values of the controls to the Web server. The Web server processes the incoming data and generally returns a response in the form of an HTML page that the Web client displays.
Let’s discuss how to build such a form.
The source code of a typical HTML page includes several structural tags in the following form:
<HTML>
<HEAD>
<TITLE>This is the title</TITLE>
</HEAD>
<BODY>
... the body of the page is defined here ...
</BODY>
</HTML>
To create an HTML form, you follow this same pattern. Within the body of the HTML document, you define a form using a pair of tags like these:
<FORM METHOD=POST ACTION=" url">
... the body of the form goes here ...
</FORM>
url specifies the protocol (HTTP), the host name, and possibly the port of the Web server in the same fashion as a URL used to access a document. However, the path and document part of url do not refer to a document to be fetched; instead, they refer to a program the Web server runs (possibly a Java servlet) to process the form’s input. The path and name don’t need to be the actual path and name of the file containing the program. Most Web servers provide a table that translates between a “document” path and name specified by the user and the actual path and name of the program that should be run.
Within the body of the form, you use HTML tags to define the controls you want. You can also include ordinary HTML text, images, and so on. Table 18.3 summarizes HTML tags you can use to include various input elements within a form. Most of the tags support attributes that modify their appearance or function. The purpose in presenting this information is to help you read HTML forms prepared by others. If you want to create your own HTML forms, you might consult a book on basic HTML. An easier approach is to use an HTML editor that lets you build forms using a point-and-click, WYSIWYG interface, such as Adobe’s PageMill or Microsoft’s FrontPage.
TABLE 18.3 SUMMARY OF FORM INPUT ELEMENTS
Tag and Attribute Input Element
<INPUT TYPE=TEXT "> Defines a text box.
<INPUT TYPE=CHECKBOX
"> Defines an on/off check box.
<INPUT Defines a radio button. All controls that have the
TYPE=RADIOBUTTON "> same name are considered part of a single set of radio buttons, only one of which can be in the “on”
state at any time.
<INPUT TYPE=SUBMIT "> Defines a submit button.
<INPUT TYPE=RESET "> Defines a reset button.
<INPUT TYPE=HIDDEN "> Defines a hidden field, the value of which is transmitted to the Web server. It cannot be manipulated by the user.
<TEXTAREA COLS=cols
ROWS=rows "> Defines a multiline text box.
<SELECT SIZE=n "> Defines a drop-down list box. Used with CHOICE.
<OPTION "> Specifies an item within the drop-down list box created by SELECT. Must be nested between the
<SELECT> and </SELECT> tags that define the list box.
Form input elements include a NAME attribute, which specifies a name for the control, and a VALUE attribute, which specifies a default initial value of an input field or the text that appears on a button. Every form must include a submit button that initiates the data upload. You should usually also include a reset button that restores the values of all controls to their initial values.
Listing 18.3 shows the simple HTML form you’ll use later in this chapter to run a Java servlet that processes form input. Study the tags and attributes used in the form and try to determine how it should operate. Figure 18.2 shows how the form looks.
Use a Web browser (not the appletviewer, which cannot display HTML text) to verify your conclusions. Then, experiment by replacing the tags and attributes to see what sorts of forms you can create. Use a WYSIWYG HTML editor such as PageMill or FrontPage if you have one. Of course, your forms won’t operate until you build an appropriate Java servlet, which you’ll learn how to do later in this chapter.
LISTING 18.3 TestPoster.java —A SIMPLE HTML FORM
<HTML>
<HEAD>
<TITLE>Poster Test Page</TITLE>
</HEAD>
<BODY>
<FORM ACTION="http://127.0.0.1:8080/servlet/poster" METHOD==POST>
<H1>Poster Test Page</H1>
<P>Name:
<INPUT TYPE=TEXT NAME=name>
<P>Type:
<P> <INPUT TYPE=RADIO NAME=type VALUE=Human> Human
<P> <INPUT TYPE=RADIO NAME=type VALUE=Clone> Clone
<P> <INPUT TYPE=RADIO NAME=type VALUE=Replicant> Replicant
<P>Status:
<P> <INPUT TYPE=CHECKBOX NAME=status VALUE=Off-world> Off-world
<P> <INPUT TYPE=SUBMIT>
<INPUT TYPE=RESET>
</FORM>
</BODY>
</HTML>
Figure 18.2: A simple input form, such as the Poster Test Page example, can upload data to a Web server.