Summary -

In this topic, we described about the <form> tag 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 -

TagDescription
<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 -

AttributeDescriptionValues
AcceptSpecifies the file types that server accepts.Not supported in HTML5File_type
actionSpecifies the URL where the form data sent to process after submitted.URL.
accept-charsetSpecifies the submitted data character encoding.HTML5 attributeA character encoding
autocompleteUsed to set the default autofill of controls in the form.on (default)off
enctypeSpecifies the type used to encode the form data.
methodSpecifies 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.
nameSpecifies the name of the form.Should be unique for the HTML documents.Text.
novalidateSpecifies the form should not be validated on submission.HTML5 attributeNone.
targetSpecifies 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-results.htm">
			<label>Search: </label>
			<input type="text" name="search" >
			<input type="submit" value="Submit">
		</form>
	</body>
</html>

Output -