Yet another type of input is hidden input.

<form>
<input type="hidden" name="location" value="USA Form">
</form>

A hidden input is a name/value pair that is returned to you but does not show up anywhere on the web page. (Of course, if someone were to look at the source of your page, they could see the hidden input coding. So, don't put any international secrets there... it may be hidden, but not that hidden ;-)

Let's suppose you were a company trying to generate leads for a new product. You have a standard form for gathering information... name, company, phone, products interested in, etc. The only problem is there are 6 slightly different versions of the form in 6 slightly different places. You need to know what's coming from where. What to do?

You could add a hidden input to your forms like so...

<input type="hidden" name="Leadform" value="Version 1"> ...for the first version
<input type="hidden" name="Leadform" value="Version 2"> ...for the second version
<input type="hidden" name="Leadform" value="Version 3"> ...for the third version

...and so on and so forth yada yada yada.

By the way, it doesn't matter what the name/value pair in the hidden input is (or any input for that matter). It can be anything you want. This would be a perfectly legitimate hidden input...

<input type="hidden" name="E" value="Mc^2"> ...You would get back E=Mc^2

An occasionally useful input is the File Upload input. With it your visitors can send you a file right off their hard drive.

<form>
<input type="file" name="myfile">
</form>

IMPORTANT NOTE: When using this type of input, you must add ENCTYPE="multipart/form-data" to your form tag. You must also specify method="post". If your form tag does not contain these attributes, then the data sent will probably be the name of the file, rather than the contents of the file.

Also be aware that the occasional older browser doesn't support this type of input and that when this input is used in a mailto form, the results can often be unpredictable. Again... when the file input is used in a mailto form, the results are often unpredictable. Use this type of input with a CGI form handler only. (actually it would be very smart to avoid mailto forms altogether)

Last on the list are the buttons. They really are very simple.

Submit of course, sends the data...

<form>
<input type="submit">
</form>

Reset clears the form.

<form>
<input type="reset">
</form>

And button, doesn't do anything!

<form>
<input type="button">
</form>

Well, actually it does... if you tell it to with some sort of scripting...

<form>
<input type="button" value="Click me" onClick="yn=prompt('What\'s your name?','');
       yn=(yn==null||yn=='')?'stranger':yn;dd=new Date();dh=dd.getHours();dhh=dh;
       dm=dd.getMinutes();dh=(dh>12)?dh-12:dh;dh=(dh==0)?12:dh;dm=(dm<10)?'0'+dm:dm;
       da=(dhh>11)?' pm.':' am.';alert('Hi '+yn+'. The time is '+dh+':'+dm+da)">
</form>

But this gets into Javascript... and that's a topic for another day.

Form Tutor

Lessons: Intro 1 2 3 4 5 6 7 8 9 10 11 12 13      Quick Forms Reference

HTML 4.0 Reference      Barebones HTML Guide