Section 1 - Introduction
Section 2 - Basics
Section 3 - Next Level
Section 4 - Advanced
Forms
How forms are sent
Input field
Buttons
Input types
Fieldset
For more help...
You try it
Advanced Tables
Frames
Style Sheets
Image Maps
Section 5 - Publishing
Section 6 - Extras
Appendices
|
Text: So far you've seen the plain <input> tag. This tag is actually a text tag, and you really should define it as such. Here's how you would do that:
-
<input type="text">
Now that you have this tag, you can modify it. The first thing you can add is a name. This name will help you when the form is sent to you. In an e-mail, if you see the word "lobster" it might not tell you anything, but if the name of the blank was "pet" and "lobster" was entered, it would tell you much more. Here's how that would work:
Code |
---|
<form method="POST" action="mailto:myaddress@mail.com">
What kind of animal makes the best companion? <input type="text" name="pet"> <br>
<INPUT TYPE=submit VALUE="Press me!">
</form>
|
|
|
You can also change the size of this box. The default size will hold twenty characters in view, but many more can be typed. (Try it - maybe with rhinoceroci-potamous-aphant.)To change the size of the box, you simply add a size command inside the input line. Let's say we want a box only ten spaces long. Here it is:
-
<input type="text" size="10" name="birthday">
Another thing you can do is specify the maximum length of a response you'll accept in the blank. This can be shorter or longer than the size of the blank. Suppose you wanted a birthday with month, day and year, and wanted someone to input it as mm/dd/yyyy. Counting the slashes, that is ten characters long. Here's how to set the "maxlength" feature:
-
<input type="text" size="10" name="birthday" maxlength="10">
One more thing you can add. Would you like to have something in the box already? Perhaps the word "Birthday" already in there? This is done by specifying a "value" in the box. Here's how that is done.
-
<input type="text" size="10" name="birthday" maxlength="10" value="Birthday">
When we put all those together, this is what we see:
Code |
---|
<form method="POST" action="mailto:myaddress@mail.com">
What is your birthdate? <input type="text" size="10" name="birthday" maxlength="10" value="Birthday"> <br>
<INPUT TYPE=submit VALUE="Enter">
</form>
|
|
|
That's how to do a text input field. Next, we go to checkboxes. Yeay.
- Text
- Checkboxes
- Radio Buttons
- Passwords
- Hidden
- File
- Image
- Textarea
- Select and Option
|