Articles

For those who want to learn how to write code in HTML, here is an application to get you started

This article shows you how to create fields and a button so people can submit information from a fill-in form on your web page.
You can have several types of controls inside a form. The most basic form has some text fields where the user can input some information, and a button to submit. Most forms will have more functionality. They may contain a button to clear or reset the fields in case the user wants to start all over.

The fields (described below) should fall between the form open and close tags:

<form> field 1, field 2, field 3... </form>

The form tag at minimum must have an "action" and a "method" argument. The action tells the form what to do with the data once the user clicks submit. An example of a very common action argument would be an email script such as formmail.cgi.

Common fields and controls in HTML forms

All fields should have a name. The name for the field and the data it contains will be passed to the script which processes the data.

The Text Field: It is used for inputting one line of limited information. An example would be a place where someone can input their name or email address. The length of a text field is usually limited in by the maxlength argument. The "size" argument tells how long the field will appear to be on the screen. Below is a simple text field.

<input type="text" name="email_address" maxlength="120">

The Text Area: This is where longer text such as comments would be input. Textareas have a scroll bar and can accept unlimited amounts of text.

<textarea name="comments" cols="50" rows="7">Please enter your comments here.</textarea>

The Radio Button: This is where people can choose one (and only one) of a certain option. They usually have a dot indicating what the user has chosen. If they change their mind, the dot will move to their new choice. A good example of where to use a radio button control would be if people were allowed to choose only one size: small, medium, or large for instance.

The Check box: This could be used for Yes/ No type questions, or you can have several check boxes if people are allowed to make one or more selections.

The Drop-Down (select) list: When people click a little down-arrow, a list drops down that the user can select one option from.

The Submit Button: Clicking this will send the results to the script defined in the "Action" property of the form.

<input name="Submit" type="submit" value="Submit">

The Clear or Reset button: This allows the entire form to be cleared in case the user wants to start all over again.

<input name="Reset" type="reset" value="Reset">

After reading this you shall be able to create a simple form asking for the user's first name, last name, email address and comments.