HTML and CSS Reference
Adding hidden input
A hidden input type is used to include extra data within a form that is not visible to
the user but is submitted along with the rest of the form data. Here is an example:
<input type="hidden" name="hiddenValue" value="42" />
When the form that contained this input is submitted, the value hiddenValue=42
would appear in the URL (if using the GET method) and would be passed to the server
side along with the other data in the form.
Note A hidden input is sometimes used with the file input type to tell the server
the maximum file size that is acceptable to upload. For instance, a form might include
the following input to tell the server script that a file upload should be limited to a max-
imum 20 kilobytes (approximately) in file size:
<input type="hidden" name="MAX_FILE_SIZE" value="20000" /> .
Button, submit, reset, and image inputs
The button input type has a lot of overlaps with the button element (discussed later
in this chapter), and between the two, the button element is probably the better choice
to use. Both create a clickable button with a text label, but the essential difference is
that the button element can use HTML elements in its label, whereas the button in-
put type can use only plain text (see the “Submitting forms using buttons and images”
section later in this chapter for an example), making it less flexible. The submit and
reset types create buttons as well, with the additional ability to submit the form (send
the data to the server) and reset the form values to their default values when clicked. As
with the button input, button can be used for these tasks as well. In short, if it looks
like a button, use the button element!
The last type, image , is for using an image in place of a submit button; it will be
discussed later in the “Submitting forms using buttons and images” section.
New input types
As you saw in Table 4-1 , there is a great variety of new types for the input element.
Some are more general, such as the input for numbers, while others are very specific,
such as creating a color picker.
Note Many of the form elements are not yet implemented in modern web browsers.
Opera and Google Chrome seem to be leading the pack, but for those that do not