HTML and CSS Reference
In-Depth Information
Figure 10.14 A submit button created using the <button> element
Other Inputs
Besides the applications we've just discussed, the <input> element has a few other use
cases. These include passing hidden data and attaching files during form processing.
Hidden Input
Hidden inputs provide a way to pass data to the server without displaying it to users. Hid-
den inputs are typically used for tracking codes, keys, or other information that is not per-
tinent to the user but is helpful when processing the form. This information is not displayed
on the page; however, it can be found by viewing the source code of a page. It should there-
fore not be used for sensitive or secure information.
To create a hidden input, you use the hidden value for the type attribute. Additionally,
include the appropriate name and value attribute values.
Click here to view code image
1. <input type="hidden" name="tracking-code" value="abc-123" >
File Input
To allow users to add a file to a form, much like attaching a file to an email, use the file
value for the type attribute (see Figure 10.15 ).
Click here to view code image
1. <input type="file" name="file" >
Figure 10.15 An input to upload a file created by way of the <input> element with a
type attribute value of file
Unfortunately, styling an <input> element that has a type attribute value of file is a
tough task with CSS. Each browser has its own default input style, and none provide much
control to override the default styling. JavaScript and other solutions can be employed to
allow for file input, but they are slightly more difficult to construct.
Search WWH ::

Custom Search