The Basics!


Yelllow = My comments
Orange = Next Section
Blue = Known
Red = New
Green = Special
White = New Links
Red-Orange = Visited Links
Green-Aqua = Active Link


Needed Tags


Here's some of the basic elements that you ALWAYS need for a form:

1. <form>
</form>

2. <form name="name of form when submitted to you">
</form>

3. <form name="name of form when submitted to you" method="POST" or method="GET">
</form>

The Method is how it will be interpreted. POST is used to post the data sent in the form (submitted by whomever fills it out) to a cgi or perl script & then is emailed to you, the person who filled it out is taken to a web page based on what they entered, or whatever the script says to do. GET is used for a cgi or perl script to receive data from somewhere else and then send it back to the person who filled it out. POST is almost always used, and a basic form, like the one I'm teaching you to make, should use POST.

4. <form name="What you want the form to be called when sent to you" method="POST" action="the location of the cgi or perl script, or the server that will send it for you">
</form>

Note:
If you are going to use a server, they'll give you the address of where to send it to. Example: GeoCities allows its members to send the forms to them at
http://www.oocities.org/cgi-bin/homestead/mail.pl?membername where membername is the member name of the registered user (GeoCities calls it's registered users "Homesteaders") and then the server, GeoCities, will interpret the data sent by the person filling out the form ,through a cgi or perl script, and send it to you.

Back to top

 


Text Boxes


 

Text boxes are little boxes that let you type stuff in them (characters) and then send what you typed to someone or something. These can be very useful for taking surveys, comments, suggestions, etc.

I'm going to name the form "sample", method "POST" and action "http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian from now on.

1. <form name="sample" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Input type="text" name="textbox">
</form>

This makes a simple text box.

Say you didn't want someone to send you more than 30 characters...

2. <form name="sample" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Input type="text" name="textbox
2" maxlength="30">
</form>

Try to enter more than 30 characters!

To separate results when you get them, don't use the same name on the same page except for radio buttons & checkboxes (I'll explain later). To have whatever you want showing when someone is filling out the form, just add the value="Whatever you want to say" to the form tag & it will look something like this...

3. <form name="sample" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Input type="text" name="textbox
3" maxlength="30" value="Hey everyone!">
</form>

Now you have...

If you want to control the size of a textbox, just add size="# of characters" to the form. I'm using 31 so you can see the text box is larger than the maximium characters you can use in it.

4. <form name="sample" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Input type="text" name="textbox
4" maxlength="30" value="Hey everyone!" size="31">
</form>

Now, FINALLY, you have a text box with all of its abilities...

EXCEPT for a password field!

A password field is a text box just like above, except only SHOWS stars (*) as what you enter, but when it's sent to you, you'll be able to see it! Here's the tag for a password field:

<form name="sample" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Input type="
password" name="passwordfield" maxlength="12" value="My fake password" size="12">
</form>

I changed the name, maxlength, and size because it fits a password field better. I mean, 31 spaces for a password, 30 allowed...I DON'T THINK SO! And the name, I just like to use different names...it's more fun. I changed the value to my fake password in the script, but is different in the example password field...try to find out what it is! Email me with the right answer & I'll put your name and/or email address on this web site! YOU MUST BE AT LEAST 13 if you want to have your name and/or email address posted! Sorry, my contest, my rules! Actually...I don't want to get GeoCities mad at me for posting minors' (under 13) name and/or email address & then having parents or anybody complain to them because of me.

Example Password Field:

HINT: What football team can be associated with "Six Rulers"?
Only 1 guess per person!
You may only win 1 time!
Password updated weekly.

Back to top

 


Text Areas


 

Text areas are a lot like the text boxes, but have more functions and are bigger.

1. <form name="sample2" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Textarea></Textarea>
</form>

Before a text area can work well, you need to add in a few tags...

2. <form name="sample2" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Textarea
name="textarea" cols="60" rows="3"></Textarea>
</form>

The name tag is needed, once again, so you can tell the difference from one textarea to another. Also, there are 2 new tags to describe. First, is the cols="#" (columns) tag. This is used to say how wide the textarea should be. I used 60, so that means I can fit 60 characters from the left to the right side in 1 row. The second tag is rows="#". This tag is used to say how many rows of cols, I'll use 60 for example, 60 there should be. Multiply the cols by rows & thats the total number of characters that can be shown at one time in that textarea.

Now you have this:

A cool ability of a textarea is its ability to "wrap" several different ways. I like to use soft, but physical is the same thing, which lets the text wrap around by itself and sent to me exactly as they typed it with line breaks (the break between lines which stop the line from going on and on instead of to the next line). Virtual wrap is lets you type with the words wrapping around to the next line, but is sent without line breaks, making a small paragraph a couple pages of just one line. Wrap="off" makes the person filling out the textarea to hit enter to go to the next line.

You can even have the textarea say what you want when the page first loads...

3. <form name="sample2" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Textarea name="textarea
2" cols="60" rows="3" value="What you want to say"></Textarea>
</form>

OR

<form name="sample2" method="POST" action="http://www.oocities.org/cgi-bin/homestead/mail.pl?wrian">
<Textarea name="textarea2" cols="60" rows="3">
What you want to say.</Textarea>
</form>

Have fun & expieriment with this!

Back to top

 


Page 2:
Check Boxes
&
Radio Boxes
Not the Musical Kind!!!

Page 2!

Back to Home Page
Back to Frames Page