Summary -
In this topic, we described about the Forms along with detailed example.
A Facility to submit the input data by user. The <form> tag used to represent a form in an HTML document. The <form> can be used with elements such as input, select and text area to create form controls.
The tag can be specified like <form action=""></form> with the form-associated elements nested inside the opening and closing tags. The elements or tag the <form> can contain are listed below -
Tag | Description |
---|---|
<button> | used to represent the button control in an HTML document |
<fieldset> | Grouping related form elements |
<image> | used to display images on the pages |
<input> | used to represent the input form control |
<keygen> | Generating a key pair |
<label> | Caption or label for the form control in HTML documents |
<object> | Embedded object or external object in an HTML documents |
<option> | used to specified option items within a <select> or <datalist> list |
<optgroup> | used to specify Selection form control option group |
<output> | Displays the Result of the calculation or user action |
<select> | used to create the drop down lost for user selection |
<textarea> | Multi-line plain text editor control in form of HTML documents |
The action attribute specifies the URL of the page that can process the form data once it submitted.
Syntax -
<form>.. text here.. </form>
Optional Attributes -
Attribute | Description | Values |
---|---|---|
accept | Specifies the file types that server acceptsNot supported in HTML5. | File_type |
action | Specifies the URL where the form data sent to process after submitted. | URL. |
accept-charset | Specifies the submitted data character encoding. Added in HTML5. | A character encoding( Ex: utf-8) |
autocomplete | Used to set the default autofill of controls in the form. | on (default)off |
enctype | Specifies the type used to encode the form data. | |
method | Specifies the HTTP method that used to send the form data submitted. | get: Used to send the form values onto the URL once it is submitted. Used to send in normal cases. Post: used to send the form data invisibly. Used for more detailed or secure data sending. |
name | Specifies the name of the form.Should be unique for the HTML documents. | Text. |
novalidate | Specifies the form should not be validated on submission. Added in HTML5. | None. |
target | Specifies in which the target destination should open. | _self: Opens link in current window / tab. _blank: Opens link in a new window / tab. |
Example -
<!DOCTYPE html>
<html>
<head>
<title>Form example</title>
</head>
<body>
<form action="search_form.htm">
<input type="text" name="search" >
<input type="submit" value="Submit">
</form>
</body>
</html>