Home
HTML and CSS
Tutorials
Forms
Level: Beginner Software:
Forms are very useful and are used for visitor feedback, guestbooks, surveys, ordering, and more.
 Form Example. |
Here is a basic form:
<form action="formmailscript.php" method="post"> Name: <input type="text" name="visitor_name" size="35"> <input type="submit" value="Send"> </form> |
The script url that you will use for the script is placed after the action attribute, as done above. There are many scripts out there that you could use. There are php and cgi scripts. Ask your system administrator which one is supported on your server. Most servers support cgi scripts. However php is much easier to use. You can pick up the one I like to use here. You can find some great cgi formmail scripts at cgi-resources.com.
The hidden attrribute is not seen my the viewer, but is used by your formmail script. The following recipent attribute tells the script where to send the visitor's submitted information to.
The name attribute is what is displayed in the e-mail that is sent to you. If you don't use this, then you won't know what field the information would belong to. In this case it wouldn't make much difference. However in most forms it will. With this, the e-mail would say something like, visitor_name: Jim.
The value attribute is what is displayed in the html page. For example, since I used Send as the value of the submit button, the submit button now reads "Send".
The size attribute specifies how long in characters the field will be.
Other field typesThere are many other form fields besides text boxes.
Password Boxes- very similiar to a textbox, except everything typed in this box will be hidden by asterisks or bullets, but is not encrytped went received in your e-mail.| <input type="password" name="password" size="10"> |
Radio Buttons- These buttons are round and you can never select more then one of them at a time. In this type of field, whatever is in the value attribute is displayed in your e-mail.
| Option 1 Option 2 <input type="radio" name="radio" value="1">Option 1 |
Checkboxes- similiar to radio buttons, but you can select as many as you want to.
| Option 1 Option 2 <input type="checkbox" name="checkbox1" value="checkbox1">Option 1 |
Menu- drop down menu with various options
|
<select name="menu"> <option value="option 1">Option 1</option> <option value="option 2">Option 2</option> </select> |
| <textarea name="comments" rows="2" cols="20" wrap="wrap">Comments</textarea> |
More HTML and CSS: Most Popular Materials | Fresh Materials
| More HTML Tutorials at Markuptutorials.com