HTML Form

An HTML form is the best solution used to collect user input. The user input is most often sent to a server for processing.

HTMLSpecify data Form and Its Attributes

HTML uses a form element to encapsulate input and submission elements. These forms handle sending the data in the specified method to a page handled by a server or handler. This topic explains and demonstrates the usage of HTML forms in collecting and submitting input data.

<form action="action.php" method="post" target="_blank"

enctype="application/x-www-form-urlencoded" autocomplete="off" novalidate></form>

Submitting

The Action Attribute

The action attribute defines the action to be performed when the form is submitted, which usually leads to a script that collects the information submitted and works with it. if you leave it blank, it will send it to the same file

<form action="action.php">

The Method Attribute

The method attribute is used to define the HTTP method of the form which is either GET or POST

<form action="action.php" method="get">

<form action="action.php" method="post">

The GET method is mostly used to get data, for example, to receive a post by its ID or name, or to submit a search query. The GET method will append the form data to the URL specified in the action attribute.

www.example.com/action.php?firstName=Mickey&lastName=Mouse

The POST method is used when submitting data to a script. The POST method does not append the form data to the action URL but sends using the request body.
To submit the data from the form correctly, a name attribute name must be specified. As an example let's send the value of the field and set its name to lastname:

<input type="text" name="lastname" value="Mouse">

Target attribute in the form tag

The target attribute specifies a name or a keyword that indicates where to display the response that is received after submitting the form.

The target attribute defines a name of, or keyword for, a browsing context (e.g. tab, window, or inline frame)

From Tag with a target attribute:

<form target="_blank">

Note: The target attribute was deprecated in HTML 4.01. The target attribute is supported in HTML5.

Frames and framesets are not supported in HTML5., so the _parent, _top, and framename values are now mostly used with iframes.

Autocomplete attribute

The autocomplete attribute specifies whether a form should have autocomplete on or off.
When autocomplete is on, the browser automatically suggests values based on values that the user has entered earlier.

<h1>The form autocomplete attribute</h1>

<p>Fill in and submit the form, then reload the page, start to fill in the form again - and see how autocomplete works.</p>

<p>Then, try to set autocomplete to "off".</p>



<form method="post" action="form_action.php" autocomplete="on">

  <label for="fname">First name:</label>

  <input type="text" id="fname" name="firstName" required><br><br>

  <label for="email">Email:</label>

  <input type="text" id="email" name="email" required><br><br>

  <input type="submit">

</form>

Enctype attribute for Uploading Files

Images and files can be uploaded/submitted to the server by setting enctype attribute of the form tag to multipart/formdata. enctype specifies how form data would be encoded while submitting to the server.

Example:

<<form method="post" enctype="multipart/form-data" action="upload.php">

  <input type="file" name="pic" />

  <input type="submit" value="Upload" />

</form>