Are
you confused about web page design and don't
know where to start? Feel free to learn HTML
and how to design your very own web site by
using our FREE Online HTML Tutorial.
HTML Tutorial Part 15:
Web Forms Continued
Hidden fields
Yet another type of input is HIDDEN input.
<INPUT TYPE=HIDDEN
NAME="FORMNAME" VALUE="Company Position Form 1">
A HIDDEN input is a name/value
pair that is returned to you but does not show
up anywhere on the web page. The hidden input
above is needed for use with Mailto Formatter.
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="FORMNAME" VALUE="Version
1"> ...for the first version
<INPUT TYPE=HIDDEN NAME="FORMNAME" VALUE="Version
2"> ...for the second version
<INPUT TYPE=HIDDEN NAME="FORMNAME" VALUE="Version
3"> ...for the third version
And so on and so forth.
By the way, it doesn't matter what the name/value
pair in the hidden input is (or any input
for that matter). I have just been using "FORMNAME"
because it saved me some typing. This would be
a perfectly legitimate HIDDEN input...
<INPUT TYPE=HIDDEN NAME="E"
VALUE="Mc^2"> ...You would get
back E=Mc^2
HIDDEN inputs are also useful for
cgi scripts. For example, many Internet Service
Providers have a script you can have your forms
sent to. It then spits the form back to you all
nice and neat and ready for human consumption.
The hidden input tells the cgi script who you
are, where to send the parsed data, etc.
Submit and Reset Buttons
Last on the list are the SUBMIT and
RESET buttons.
They really are very simple...
<INPUT TYPE=SUBMIT>
SUBMIT of course, sends the data...
...and RESET, clears the form.
<INPUT TYPE=RESET>
We can easily change what the buttons say.
<INPUT TYPE=SUBMIT VALUE="Send
it away!"><BR>
<INPUT TYPE=RESET VALUE="Clear
the form Norm!"><P>
If necessary, the SUBMIT button can
also have a NAME. You would need this
if, for whatever reason, you had more than one
SUBMIT button.
Next we must tell the browser where to send
the data we gather and how to send it. There are
two basic things you can do:
1) you can send the data to a cgi script for processing,
or
2) you can have the data emailed to you.
As for the first, whoever wrote the script can
tell you how the data should be sent.
The second, or mailto form should have
the following attributes in the <FORM>
tag.
Note- Microsoft's Internet
Explorer 3.0 does not support mailto forms. When
you try to submit the information, the new mail
message window pops up. Explorer does however
support forms sent to a CGI script.
<FORM METHOD=POST
ACTION="mailto:testing" ENCTYPE="application/x-www-form-urlencoded">
This line is very important. The only thing
you have to do is plug in your email address after
mailto: The rest must be written exactly as shown.
The words FORM, METHOD,
POST & ACTION do not have
to be capitalized but there must be a
space between each attribute.. between FORM
& METHOD, between POST &
ACTION, and between .com"
& ENCTYPE.
Unfortunately the data will be sent to you in
this 'only useful to a computer' format...
FORMNAME=New+Entrant&NAME=R.U.+Havinfun&ADDRESS=1313+Mockingbird+Lane
&CITY=Beverly+Hills&STATE=CA
What you'll need is a program to turn it into
'useful to a human' format...
FORMNAME=New Entrant
NAME=R.U. Havinfun
ADDRESS=1313 Mockingbird Lane
CITY=Beverly Hills
STATE=CA
Some
mail programs are capable of converting
the data without resorting to a separate
program. You may want to try this
method first. Just remove the instruction
ENCTYPE="application/x-www-form-urlencoded"
and in its place use ENCTYPE="text/plain". |
|
When you put a mailto form on your page and
someone sends you information, you'll notice that
it is sent with a default Subject. If your visitor
was using Netscape you'd get the default Subject
"Form posted from Mozilla". Other browsers
might send "Form Response", etc.
You can change this by editing what's in the
<FORM> tag as follows...
<FORM METHOD=POST ACTION="mailto:xxx@xxx.xxx?subject=Company
feedback form" ENCTYPE="application/x-www-form-urlencoded">
Your own HTML page...
Open the page "feedback.htm" in Notepad, and add
the following (the blue text is what to add).
<html>
<body background="bgnd.gif">
<center><h1>Feedback Form</h1></center>
<br>
<form method=post action="mailto:YOUREMAILADDRESS?subject=Feedback"
enctype="text/plain">
<b>My name is: </b><input type=text
name="name">
<p>
<b>I work as a:</b><br>
.
.
</p>
<p>
<b>When it comes to web browsers:</b><br>
.
.
</p>
<b>I rate your site as:</b><br>
.
.
</p>
<p>
<b>Comments:</b><br>
.
.
</p>
<p>
<input type="submit" value="Send it!"><br>
<input type="reset" value="Clear it!">
</p>
</body>
</html>
Save the file.
Go To The
Next Page
|