Syntax | This element uses separate opening and closing tags.<form>...</form> |
---|---|
Usage | The <form> tag is used to create a container for controls. The controls can collect user input, and web page content, that will be sent to a server. The following tags can be used to create controls within the form container: <button>, <input>, <select>, <textarea>, <object> The <input> tag is versatile and can be used to create the following control types: button, checkbox, file, hidden, image, password, radio, reset, submit, text The <label> tag can be used to provide a label for various controls. The <fieldset> and <legend> tags can group multiple controls together and provide a caption for the group. The title attribute should be used with controls when a label is not used. This will help make the control more accessible for non-visual browsers. HTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post"> <p> Checkbox: <input type="checkbox" name="checktest" value="on" title="checkbox sample"><br> RadioButton1: <input type="radio" name="rbtest" value="one" title="radio button1 sample"><br> RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked" title="radio button2 sample"><br> Text: <input type="text" name="texttest" title="text input sample"><br> Password: <input type="password" name="passtest" title="pwd sample"><br> <input type="submit" value="Send"> <input type="reset"> </p> </form> XHTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post"> <p> Checkbox: <input type="checkbox" name="checktest" value="on" title="checkbox sample" /><br /> RadioButton1: <input type="radio" name="rbtest" value="one" title="radio button1 sample" /><br /> RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked" title="radio button2 sample" /><br /> Text: <input type="text" name="texttest" title="text input sample" /><br /> Password: <input type="password" name="passtest" title="pwd sample" /><br /> <input type="submit" value="Send" /> <input type="reset" /> </p> </form> |
Content Model | The <form> element can contain the following tags, and Text, between its opening and closing tags when using DTD Transitional and Frameset documents. <a>
<abbr>
<acronym>
<address>
<applet>
<b>
<basefont>
<bdo>
<big>
<blockquote>
<br>
<button>
<center>
<cite>
<code>
<del>
<dfn>
<dir>
<div>
<dl>
<em>
<fieldset>
<font>
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<hr>
<i>
<iframe>
<img>
<input>
<ins>
<isindex>
<kbd>
<label>
<map>
<menu>
<noframes>1
<noscript>
<object>
<ol>
<p>
<pre>
<q>
<s>
<samp>
<script>
<select>
<small>
<span>
<strike>
<strong>
<sub>
<sup>
<table>
<textarea>
<tt>
<u>
<ul>
<var>
The <form> element can contain the following tags between its opening and closing tags when using DTD Strict documents. <address>
<blockquote>
<del>
<div>
<dl>
<fieldset>
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<hr>
<ins>
<noscript>
<ol>
<p>
<pre>
<script>
<table>
<ul>
Notes:1. The <form> element can contain the <noframes> tag when using DTD Transitional documents but not Strict or Frameset documents. 2. Red tags have been deprecated and are allowed in DTD Transitional and Frameset documents but not Strict documents. |
Required | Tag Specific | Core | Focus | Events | Language |
---|---|---|---|---|---|
action | accept accept-charset enctype method name1 onreset onsubmit target | id class style title | onclick ondblclick onkeydown onkeypress onkeyup onmousedown onmousemove onmouseout onmouseover onmouseup | dir lang xml:lang2 | |
Notes: 1. deprecated in XHTML. 2. XHTML only. |
Attribute | Description |
---|---|
action | The action attribute specifies the URL where the form data will be sent and processed. HTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post">
<p>
Checkbox: <input type="checkbox" name="checktest" value="on"
title="checkbox sample"><br>
RadioButton1: <input type="radio" name="rbtest" value="one"
title="radio button1 sample"><br>
RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked"
title="radio button2 sample"><br>
Text: <input type="text" name="texttest" title="text input sample"><br>
Password: <input type="password" name="passtest" title="pwd sample"><br>
<input type="submit" value="Send"> <input type="reset">
</p>
</form> XHTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post">
<p>
Checkbox: <input type="checkbox" name="checktest" value="on"
title="checkbox sample" /><br />
RadioButton1: <input type="radio" name="rbtest" value="one"
title="radio button1 sample" /><br />
RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked"
title="radio button2 sample" /><br />
Text: <input type="text" name="texttest" title="text input sample" /><br />
Password: <input type="password" name="passtest" title="pwd sample" /><br />
<input type="submit" value="Send" /> <input type="reset" />
</p>
</form> Note: This is a required attribute. |
accept | The accept attribute specifies a comma separated list of content types that the server will handle correctly when processing the form data. |
accept-charset | The accept-charset attribute specifies a list of character encodings that the server will accept when processing the form data. |
enctype | The enctype attribute specifies the content type to be used for submitting the form data to the server when the value of the method attribute is "post". The default value for the enctype attribute is "application/x-www-form-urlencoded". Use "multipart/form-data" if the <input> tag is being used with its type attribute set to "file". Another possible value for the enctype attribute is "text/plain". HTML <form> tag example using the <input> tag with its type attribute set to file. <form action="example_input.php" method="post" enctype="multipart/form-data">
<p>
Select the File: <input type="file" name="filetest" accept="image/gif">
<br>
<input type="submit" value="Send"> <input type="reset">
</p>
</form> XHTML <form> tag example using the <input> tag with its type attribute set to file. <form action="example_input.php" method="post" enctype="multipart/form-data">
<p>
Select the File: <input type="file" name="filetest" accept="image/gif" />
<br />
<input type="submit" value="Send" /> <input type="reset" />
</p>
</form> |
method | The method attribute specifies the HTTP method that will be used to submit the form data to the server. Possible values are "get" and "post". For the "get" method, the form data is appended to the URL using a question mark "?" to separate URL from the form data. For the "post" method, the form data is included in the body of the form. Notes: 1) When using the "get" method, the form data may be visible in the browser address bar. Therefore, the "get" method is not suitable for passwords or other private information. 2) The "get" method uses only ASCII character values. The "post" method can use the entire ISO10646 character set if the enctype attribute is set to "multipart/form-data". 2) When using the "get" method, browsers may place a size limit on the amount of form data that may submitted. The "post" method does not have the same size limitation. HTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post">
<p>
Checkbox: <input type="checkbox" name="checktest" value="on"
title="checkbox sample"><br>
RadioButton1: <input type="radio" name="rbtest" value="one"
title="radio button1 sample"><br>
RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked"
title="radio button2 sample"><br>
Text: <input type="text" name="texttest" title="text input sample"><br>
Password: <input type="password" name="passtest" title="pwd sample"><br>
<input type="submit" value="Send"> <input type="reset">
</p>
</form> XHTML <form> tag example using various <input> tag controls. <form action="example_input.php" method="post">
<p>
Checkbox: <input type="checkbox" name="checktest" value="on"
title="checkbox sample" /><br />
RadioButton1: <input type="radio" name="rbtest" value="one"
title="radio button1 sample" /><br />
RadioButton2: <input type="radio" name="rbtest" value="two" checked="checked"
title="radio button2 sample" /><br />
Text: <input type="text" name="texttest" title="text input sample" /><br />
Password: <input type="password" name="passtest" title="pwd sample" /><br />
<input type="submit" value="Send" /> <input type="reset" />
</p>
</form> |
name | The name attribute assigns a name that can be used to as reference from scripts or style sheets. The name attribute has been deprecated in XHTML but not HTML. For XHTML, the id attribute can be used instead. To increase forward and backward compatibility, both the name and id attributes can be set to the same value. Note: deprecated in XHTML. |
onreset | The onreset attribute is used to specify a script to be be run when the form is reset. |
onsubmit | The onsubmit attribute is used to specify a script to be be run when the form is submitted. |
target | After a form is submitted, the resulting web page will typically open in the current browser window. The target attribute allows an alternate destination to be specified. Setting the target attribute to "_blank" will open the web page in a new tab or window. Setting the target attribute value to match the value of the id attribute in an <iframe> tag will open the web page in the specified iframe. If you're in a frame, setting the target attribute to "_top" will open the web page in the top original window. Note: This attribute has been deprecated. |
id | The id attribute assigns a unique name to a tag. This allows style sheets or scripts to reference the tag. See id Example |
class | The class attribute assigns a class name to a tag. The class name does not need to be unique. More than one tag can have the same class name. This allows style sheets or scripts to reference multiple tags with a single class name. See class Example |
style | The style attribute specifies styles for the tag. For Cascading Style Sheets (CSS), the syntax is name:value. Each name:value pair is separated by semicolons. See style Example |
title | The title attribute specifies additional information about the tag. It is common for browsers to display the title when the pointing device stops over the object. See title Example |
onclick | The onclick attribute specifies a script to be run when the object is clicked with a mouse or other pointing device. See onclick Example |
ondblclick | The ondblclick attribute specifies a script to be run when the object is double clicked with a mouse or other pointing device. See ondblclick Example |
onkeydown | The onkeydown attribute specifies a script to be run when a key is pressed down. See onkeydown Example |
onkeypress | The onkeypress attribute specifies a script to be run when a key is pressed and released. See onkeypress Example |
onkeyup | The onkeyup attribute specifies a script to be run when a key is released. See onkeyup Example |
onmousedown | The onmousedown attribute specifies a script to be run when the mouse button, or other pointing device button, is pressed while over the object. See onmousedown Example |
onmousemove | The onmousemove attribute specifies a script to be run when the mouse, or other pointing device, is moved while it is over the object. See onmousemove Example |
onmouseout | The onmouseout attribute specifies a script to be run when the mouse, or other pointing device, is moved away from an object after being over it. See onmouseout Example |
onmouseover | The onmouseover attribute specifies a script to be run when the mouse, or other pointing device, is moved onto the object. See onmouseover Example |
onmouseup | The onmouseup attribute specifies a script to be run when the mouse button, or other pointing device button, is released while over the object. See onmouseup Example |
dir | The dir attribute tells the browser whether the text should be displayed from left-to-right or right-to-left. It does not reverse the direction of the characters, like the <bdo> tag does, but it can help the browser to determine if the text should be aligned on the left side or the right side. See dir Example |
lang | The lang attribute specifies a language. This attribute can help the browser to correctly display text. This attribute can also be useful for braille translation software, speech synthesizers, dictionary definitions, etc. See lang Example |
xml:lang | The xml:lang attribute specifies a language for XHTML documents. This attribute can help the browser to correctly display text. This attribute can also be useful for braille translation software, speech synthesizers, dictionary definitions, etc. See xml:lang Example Note: XHTML only. |
<form> tag example using various <input> tag controls. <form> tag example using the <input> tag with its type attribute set to file. |