PLEASE NOTE FORMS DO NOT WORK ON MSN SPACES.
Input Box
To insert an input box into your website you will need the following <input type="text">. This will produce a box like this:
There are many ways to customise the text box, firstly you will need a name for the box, so when you send your form off the reciever will know what the value in the box is, e.g. name="first name". You can also edit the size of the box, this is done with the script size="25", changing 25 to whatever you want. Say you want to limit the amount of characters a person can enter into the field, well, you can, with the script maxlength="60", changing the 60 to whatever you want. An example script is <input type="text" size="25" maxlength="60">
Text Area
To put a text area into your website just put <textarea></textarea>. This will produce this box:
As with all items on your forms page, it will need a name e.g. name="comments". You can also change the size of the box by these two scripts, one is rows="5" and cols="30", rows is the height of the box (in lines) and cols is the width of the box. An example script is <textarea name="comments" rows="5" cols="30"></textarea> If you want to put some text into the box as defult just type whatever you want in between the two tags.
Radio Buttons
Radio buttons are normally used in two's or more. This is because radio buttons are used for questions with only one answer e.g. Male or Female? To put a radio button on your site use this code, <input type="radio">, this produces this radio button:
There is 1 thing all radio buttons need, and that is a name, this defines radio buttons into groups, for example, you want to ask if a user is male or female. The name of the button could be gender, the name gender would be assigned to both buttons. Then you would need a value for each radio button, in the gender case one is value="male" and the other is value="female". Other questions will have a different names. If you want to preselect an option the just add checked to one of the radio button. An example is <input type="radio" name="gender" value="male" checked> MALE <br> <input type="radio" name="gender" value="female"> FEMALE, this will produce this:
MALE
FEMALE
Check Boxes
Check Boxes are for questions with more than one answer, for example, what food do you like? Pizza, Chicken, Chips? To put a checkbox into your website then just use this script <input type="checkbox">. This produces this:
Editing this checkbox is pretty much the same as other items in a form. There is a name, which is applied to all options for each question, with a different name for each questions options. Value is the value given to each checkbox, in the food question it could be value="pizza", value="chicken" and value="chips". Again if you want any of the options to be pre-selected just add checked to the checkbox. An example is <input type="checkbox" name="food" value="pizza" checked> PIZZA <br> <input type="checkbox" name="food" value="chicken"> CHICKEN <br> <input type="checkbox" name="food" value="chips"> CHIPS, this will produce:
PIZZA
CHICKEN
CHIPS
Drop Down Boxes
To add a drop down box to your site just add <select><option>Option 1</select>, this will produce:
Option 1
You can give the drop down box a name, as with all items in a form. You can also add multiple options, to do this just add <option>Option # as many times as you require. If you want to have an option pre-selected just add selected to an option tag e.g. <option selected>. An example is <select name="rating"><option>Great<option selected>Good<option>Average<option>Poor<option>Pants</select>, this produces:
GreatGoodAveragePoorPants
Submit & Reset Buttons
To put a submit button onto your website involves a simple script, this is <input type="submit">, this produces:
You can edit the text that appears in this button (or the Reset button below by adding value="Submit" to the submit tag e.g. <input type="submit" value="Submit">, this produces:
.
To add a reset button to your site also involves a simple script, this is <input type="reset">. This produces
Putting It All Together
All the items in your form need to be encased in a form tag. This tells your Internet Explorer that everything inbetween the form tags needs to be sent off when Submit is pressed. An example is <form method="post" action="/cgi-bin/mail> </form>. Please note, you cannot just add this script to your site and it works, you need to have a CGI program to handle the form when it is submitted. You can either get a program from CGI Resource Index, check with your web server to see if the have a service that can forward your forms to your e-mail or wherever or produce your own CGI script (this may get covered in my Expert section).
An example script is:
<form method="post" action="cgi-bin/mail">
NAME: <br><input type="text" size="25" maxlength="60"><br><br>
COMMENTS: <br>
<textarea name="comments" rows="5" cols="30">Please leave your comments here...</textarea><br><br>
SEX: <br>
<input type="radio" name="gender" value="male" checked> MALE<br>
<input type="radio" name="gender" value="female"> FEMALE<br><br>
WHAT FOODS DO YOU LIKE?:<br>
<input type="checkbox" name="food" value="pizza" checked> PIZZA <br>
<input type="checkbox" name="food" value="chicken"> CHICKEN <br>
<input type="checkbox" name="food" value="chips"> CHIPS<br><br>
WHAT DO YOU THINK OF MY SITE?<br>
<select name="rating">
<option>Great
<option selected>Good
<option>Average
<option>Poor
<option>Pants
</select>
<br>
<br>
<center><input type="submit" value="Submit"><input type="reset"></center>
</form>
This produces:
NAME:
COMMENTS:
Please leave your comments here...
SEX:
MALE
FEMALE
WHAT FOODS DO YOU LIKE?:
PIZZA
CHICKEN
CHIPS
WHAT DO YOU THINK OF MY SITE?
GreatGoodAveragePoorPants
Thats all for now. Have fun!