Please note, this is a STATIC archive of website developer.mozilla.org from 03 Nov 2016, cach3.com does not collect or store any user information, there is no "phishing" involved.

Form and button basics

Draft
This page is not complete.

In this article we'll take you through the basics of HTML forms, including their purpose, basic features, and common form controls. We'll also have a look at HTML buttons and how they can be used.

Prerequisites: Familiarity with HTML fundamentals (as covered in Getting started with HTML.)
Objective: To become familiar with the purpose and basic features of HTML forms, and be able to write your own simple forms.

Why do we have forms?

HTML forms for collecting user data, and sending them to a server for storage (e.g. in database)

analogous to paper and pen forms you fill in for some doctors and government departments

A basic form

<form>, cover basic attributes.

Briefly say that form controls are generally structured using containers like divs and lists, as well as specialised items like fieldsets. But we'll cover those in a different article.

Show example

Make sure the basic inputs are covered:

input type=text

input type=submit

textareas

Where does the data go when a form is submitted?

Talk about servers receiving requests

depending on form method, data will be sent as get parameters or post data (main options)

the action attribute specifies what server-side file the data is sent to for processing. 

at this point the server-side code will do something like put the data in a database.

Providing choices in forms

radio buttons

checkboxes

select elements

show an example of each.

Summary of article

Document Tags and Contributors

 Contributors to this page: chrisdavidmills
 Last updated by: chrisdavidmills,