Forms

Section 1 - Introduction
Section 2 - Basics
Section 3 - Next Level
Section 4 - Advanced
      Fancy Lists
      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
Now that you've learned to make a simple form and you can tell the form to post data, you need some buttons to make the form work. The first and most signifigant button you need is called a "submit" button. Because this is also something the user can click, it is also a form of input. The code for the button looks like this:
<INPUT TYPE=submit VALUE="Press me!">
That produces:
You tried it, didn't you? This button wasn't connected to an action, so it may have reloaded the page, but nothing else. When you put this button in connection with other elements of a form, it becomes wonderful.
Code
<form method="POST" action="mailto:myaddress@mail.com">
This is just text. <input> <br>
<INPUT TYPE=submit VALUE="Press me!">
</form>
What you see
This is just text.
If you pressed the button, you actually sent an e-mail, but because myaddress@mail.com isn't a real address, the message was lost. This is all you have to do to make a completely working form.

Of course, there are also other tags you can add and buttons you can make. The other useful button when first learning forms is the "reset" button. This button clears everything in the form. It is made like this:
<INPUT TYPE=RESET VALUE="Clear the form">
This is used in conjunction with most forms. Here's how it would look with that small form we made.
Code
<form method="POST" action="mailto:myaddress@mail.com">
This is just text. <input> <br>
<INPUT TYPE=submit VALUE="Press me!">
<INPUT TYPE=RESET VALUE="Clear the form">
</form>
What you see
This is just text.

Back Home Forward