Home » HTML Help » Learn HTML » HTML Code

HTML Forms

Chances are, you will not need HTML Forms immediately. HTML forms are the input boxes and submit buttons you so often see which collect data such as logins and credit-card information to pass on to the server for processing. We'll cover some simple HTML forms and later in the tutorial dig into simple CGI email scripts which you can use together with forms for simple sending of email feedback.

HTML Forms - simple overview

An HTML form is a set of one or more input controls and a submit button. The form controls are surrounded by a <form> tag which has two important attributes: action and method. Action is the URL destination where the information will be sent and Method defines how the information will be sent (either "post" or "get").

Forms themselves are not visible but contain visible elements such as list-boxes and drop-down lists. Here's a very simple form example: 

 <form action="http://someurl.com" method="get">
  <input name="first" value="Hi">
  <input type="submit" value="Send">
 </form>

HTML Forms - Field Types

Again, this is just an overview, you won't need to use forms for some time but just for completeness, let's quickly look at an example of each form field type:

Radio Buttons - options selection where the user can select only one of several options:

 <form>
  <input type="radio" name="choice" value="A">Choice A<br>
  <input type="radio" name="choice" value="B">Choice B
 </form>
Choice A
Choice B

Check Boxes - the user can select multiple options:

 <form>
  Subscribe <input type="checkbox" name="subscribe"> <br>
  Send Samples  <input type="checkbox" name="samples" checked>
 </form>
Subscribe
Send Samples

Text Field - a text input box like in the example above

 <form>
  <input type="text" name="value" value="TypeHere">
 </form>

Drop-down Box - a text input box like in the example above

 <form> Month:
  <select name="Month">
   <option value="1"> January
   <option value="2"> February
   <option value="3"> March
   <option value="4"> April
  </select>
 </form>
Month:

Hidden - this type does not show at all! It is used to pass information on to the server which you do not want the user to either see or edit. 

  <form>
   <input type="hidden" name="page" value="page 12">
  </form>

HTML forms are really quite easy. The interesting part is putting them to work passing information between dynamic pages or server CGI scripts. That will come a bit later. For now, let's learn a few concepts about scripting in general - both server and client-side scripting.


Learn about HTML Scripts -->
<-- Back to HTML Frames