Click Here!
home account info subscribe login search My ITKnowledge FAQ/help site map contact us


 
Brief Full
 Advanced
      Search
 Search Tips
To access the contents, click the chapter and section titles.

HTML 4.0 Sourcebook
(Publisher: John Wiley & Sons, Inc.)
Author(s): Ian S. Graham
ISBN: 0471257249
Publication Date: 04/01/98

Bookmark It

Search this book:
 
Previous Table of Contents Next


Definitions of Different TYPEs

TYPE=“button”Specifies an input button; the label of the element is obtained from the VALUE attribute value. Button data are never sent when a FORM is submitted—the button type is designed purely as an interface between FORM content and script programs within the HTML document containing the form. This is discussed in more detail in Chapter 7.
TYPE=“checkbox”The input element is a checkbox. A checkbox defines a Boolean (on/off) quantity, the default state of which is off (this is changed to on if a CHECKED attribute is present). VALUE sets the value assigned to an on checkbox. When you submit a FORM, the name/value pair is sent only if the checkbox is on. If there is no VALUE attribute to a TYPE=“checkbox” input element, then the browser uses the string “on” as the default value “on.”
Different checkboxes may associate different values with the same variable name. This is convenient, for example, if you have six different databases to search and want to allow the user to select one, two, or all of them. When the FORM is submitted, the browser sends all the values from the on checkboxes, yielding several name/value pairs with the same name. An example is shown in Figure 6.21.
TYPE=“file”The INPUT element is a file-selection tool or widget, with which the user can select an arbitrary file to be sent to the server, as part of the submitted form data. This type is allowed only when the FORM element specifies ENCTYPE=“multipart/form-data.” Note that this may cause problems if the ACTION indicates a mailto URL and if the file contains binary data: The encoding make no special provisions for binary data, and such data are often corrupted when sent by e-mail.
TYPE=“hidden”The INPUT element is not displayed to the user, although the content of a “hidden” element (set by the NAME and VALUE attributes) is always sent to the server when the FORM is submitted. This is useful for passing information back and forth between the client and server, and is typically used to record the state of the client-server interaction. Recall that the HTTP protocol is stateless, so that without such passed information, the gateway program handling the FORM data has no record of any past interaction. Thus, a “hidden” INPUT element is typically placed in a FORM by a server-side program that assembles the FORM. This is discussed in more detail in Chapters 10 and 11.


Figure 6.21 HTML example document illustrating several FORM INPUT elements and the SELECT element. Figure 6.22 shows this document as displayed by the Netscape Navigator 3 browser.

<HTML>
<HEAD>
<TITLE> Example of an HTML FORM </TITLE>
</HEAD>
<BODY>
<H1>HTML FORM Example </H1>
<BLOCKQUOTE>

<FORM  ACTION=“http://side.edu/cgi-bin/script”>

<P><B>Search String:</B> <INPUT TYPE=“text” NAME=“search_string” SIZE=24> 
<P><B>Search Type:</B>
<SELECT NAME=“search_type”>
  <OPTION> Insensitive Substring
  <OPTION SELECTED> Exact Match
  <OPTION> Sensitive Substring
  <OPTION> Regular Expression
</SELECT>
<P><B> Search databases in:</B>
  [<INPUT TYPE=“checkbox” NAME=“servers” VALUE=“Canada” CHECKED>Canada]
  [<INPUT TYPE=“checkbox” NAME=“servers” VALUE=“Russia”>Russia]
  [<INPUT TYPE=“checkbox” NAME=“servers” VALUE=“Sweden”>Sweden]
  [<INPUT TYPE=“checkbox” NAME=“servers” VALUE=“U.S.A.”>U.S.A.]
  <BR><SMALL><EM>Multiple items can be selected.)</EM></SMALL>
<P><B>Niceness: </B>
<MENU>
<LI> <INPUT TYPE=“radio” NAME=“niceness” VALUE=“nicest” CHECKED > Nicest
<LI> <INPUT TYPE=“radio” NAME=“niceness” VALUE=“nice” >   Nice
<LI> <INPUT TYPE=“radio” NAME=“niceness” VALUE=“not nice”> Not Nice
<LI> <INPUT TYPE=“radio” NAME=“niceness” VALUE=“nasty” >  Nasty
</MENU>
    <P> <INPUT TYPE=“submit” NAME=“sub” VALUE=“Start Search”>
    <INPUT TYPE=“reset” VALUE=“Reset Form”>

</FORM>
</BLOCKQUOTE>
<HR>
<ADDRESS>  Form by <A HREF=“about_the_author.html”> I.S.G</A> </ADDRESS>
</BODY> </HTML>


Figure 6.22  Display of the document shown in Figure 6.21 by the Netscape Navigator 3 browser.

TYPE=“image” The INPUT element is an inline active image (analogous to an ISMAP active IMG element). The SRC attribute specifies the URL of the image to include.
Clicking on the image immediately submits the FORM data, including the coordinates of the mouse pointer (measured in pixels from the upper left-hand corner of the image). The coordinates are sent in two name/value pairs. The name is created by taking the NAME attribute and appending the strings “.x” and “.y” to indicate the x or y coordinate. Thus, if the NAME is “king,” the coordinates are sent as the name/value pairs king.x=xval and king.y=yval, where xval and yval are the pixel coordinates selected by the user.
TYPE=“object” (Netscape Navigator 4 only) The INPUT element references a JavaBean object that will pass data to the form for inclusion in the form message. The NAME attribute then corresponds to the ID attribute of an existing JavaBean object previously created using an OBJECT element. When the form is submitted, the data sent by the object are included with the form and are associated with the specified NAME. Note that the connection between the OBJECT and the form is managed using Netscape’s LiveConnect extensions to JavaScript.
TYPE=“password” The INPUT element is a single-line text field, but the text typed into the field is obscured by asterisks or by some other method. This is used for password entry. An example password field is shown in Figures 6.23 and 6.24.
TYPE=“radio” The INPUT element is a radio button. Radio buttons are only meaningful when there are multiple buttons taking the same NAME attribute value. Sharing a common NAME links the buttons together, such that when a user selects or turns on one of the radio buttons, all other buttons associated with the same NAME are automatically turned off. Thus, only one button can be selected at a time. Each radio button must have a value, so that every INPUT element of TYPE=“radio” must have a VALUE attribute. However, if a value is left off, the browser will assume a default value, typically the string “on.”
TYPE=“reset” The INPUT element is a reset button. When this element is selected, all the fields in the FORM are reset to the values given by their respective VALUE attributes, thereby erasing all user input. RESET can itself have a VALUE attribute, the value of which is used as the button label. Data from TYPE=“reset” buttons are never sent to the server when the form is submitted.
TYPE=“submit” The INPUT element is a submit button. Pressing the submit button sends the FORM data to the specified URL. A form can have more than one such button, each with different NAME and VALUE attributes: The FORM sends only the name/value pair associated with the pressed submit button. The value is displayed as the button label.


NOTE: Possible INPUT Element Problems with Older Browsers

Some older browsers do not support multiple submit buttons with different name/value pairs. Also, Netscape Navigator 2, as well as early versions of Internet Explorer 3, do not support the TYPE=“file” input element.



Previous Table of Contents Next


Products |  Contact Us |  About Us |  Privacy  |  Ad Info  |  Home

Use of this site is subject to certain Terms & Conditions, Copyright © 1996-2000 EarthWeb Inc.
All rights reserved. Reproduction whole or in part in any form or medium without express written permission of EarthWeb is prohibited. Read EarthWeb's privacy statement.