HTML Tutorials

Hidden fields

A hidden field lets you collect name and value information that the user can’t see along with the rest of the form data. Hidden fields are useful for keeping track of information associated with the form, such as its version or name.

If your Internet service provider (ISP) provides a generic application for a guest book or feedback form, you might have to put your name and e-mail address in the form’s hidden fields so that the data goes specifically to you.

To create a hidden field, here’s what you do:

  1. Use the <input> element with its type attribute set to hidden.
  2. Supply the name and value pair you want to send to the form handler.

Here’s an example of markup for a hidden field:

<!DOCTYPE html>
    <form method="post">
      <input type="hidden" name="e-mail" value="">
        <li>First Name: <input type="text" name="firstname" size="30"
        <li>Last Name: <input type="text" name="lastname" size="30"
        <li>Password: <input type="password" name="psswd" size="30"
  • First Name: 
  • Last Name: 
  • Password: 

As a rule, using an e-mail address in a hidden field is just asking for that address to be picked up by spammers. If your ISP says that this is how you should do your feedback form, ask for suggestions as to how you can minimize the damage. Surfers to your page can’t see your e-mail address, but spammers’ spiders can read the markup. At a minimum, you would hope that your ISP supports one of the many JavaScript encryption tools available to obscure e-mail addresses from harvesters.