Hidden Fields
Like cookies, hidden fields in forms are a technique for preserving state information.
- Server-side programs process forms.
- In response to a form submission, they process the data entered into a form
and generate a new form.
- The new form may contain hidden fields.
- The hidden fields contain data from the previous form.
- This hidden data is the state information.
- The server-side program that processes the new form receives
the state information along with additional data entered into fields in the new form.
- Thus, as the application moves from one form to the next, data accumulates
in the hidden fields.
- The user gets the sensation of having a "session".
- The state information is not truly hidden; an inquisitive user can see
it by viewing the document source.
- Hidden fields, like other form fields, are accessed from Javascript code
via the elements array.
Our Web Cellar form
elicits a shipping address and has a hidden field containing
the dollar amount of a wine purchase.
Here's the source code.
Discover:
- the Hidden field object
- how to insert dynamic text into the current document with document.write() (we saw this in the previous chapter)
Lab
Your task:
- Copy the sample form and add to it as follows.
- Display the amount to be charged for shipping,
based on the price of the user's purchase, e.g.:
Shipping charge: $10
- Calculate the shipping charge from the value of the
hidden field named price.
- If the price is under $100, the shipping charge is $10.
Under $200 is $15, etc.
Solution
Don't peek unless you're stuck!