form (HTML element)

Spec
Depr. Empty Version
No No HTML 2
Browser support (more…)
IE5.5+ FF1+ SA1.3+ OP9.2+ CH2+
Full Full Full Full Full

Syntax

<form action="uri" enctype=" { application/x-www-form-urlencoded | multipart/form-data | text/plain } " method=" { get | post } ">
</form>

Description

The form element is the container that defines the start and end points for a form that a site visitor can fill in. Any fields that are located between the opening <form> and closing </form> tags will be associated with this form. It’s possible to have multiple form elements on a page.

form is a block-level element, which means that it will take up the full width of the page (or the containing element) and create a break before and after itself. However, without additional CSS styling, there’s no discernible boundary between it and the surrounding markup (for example, the form has no border or background color).

Information can be captured in the form using many different form-specific elements. These controls include the input element, as well as textarea, select, and button. There are also labeling and grouping controls, which include the fieldset, legend, and label elements.

Example

Here’s a simple booking form:

<form action="form-to-email.php" method="post">
  <div>
    <label for="txtname">Name:</label>
    <input type="text" name="txtname" id="txtname"/>
  </div>
  <div>
    <label for="txtcontacttel">Contact Tel:</label>
    <input type="text" name="txtcontacttel" id="txtcontacttel"/>
  </div>
  <div>
    <input type="submit" name="cmdSubmit" id="cmdSubmit"
        value="Send booking details"/>
  </div>
</form>

Use This For …

This element is used to capture user information (shipping address details, credit card information, customer names and titles, and so on). form may also be used for the purposes of navigation. Although it’s not the original intent of forms, this application isn’t unusual. For example, you might use select lists as navigation menus, and have the user press a Go button to activate the menu item.

Compatibility

Internet Explorer Firefox Safari Opera Chrome
5.5 6.0 7.0 8.0 1.0 1.5 2.0 3.0 3.5 1.3 2.0 3.1 4.0 9.2 9.5 10.0 2.0
Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full Full

It causes no compatibility issues, and has excellent support across all tested browsers.

In addition to the attributes listed here is one other that deserves a mention: autocomplete is an Internet Explorer-only attribute which can be used to enable or prevent form information from being stored and recalled later using that browser’s autocomplete facility. The value for autocomplete can be "on" or "off".

In this Section

User-contributed notes

ID:
#1
Contributed:
by logic_earth
Date:
Wed, 12 Mar 2008 15:55:14 GMT

I see this problem often when working with forms and Internet Explorer not working when the form is submitted.

Usually the problem lies when the user submits the form without clicking the submit button (I don't know if this is a bug or not) IE will not send the submit button. As most scripts check for the button it will fail. So instead of checking for the button check for a required field or add a hidden field and check for that.

PHP Example:
[code]
<?php

if ( isset( $_GET['email'] ) ) {
// ... Run code ...
}
[/code]

Related Products