FOLLOW US ON TWITTER



FOLLOW US



img/blogimg/html5.jpg


@coder 878

HTML Forms


2021-11-17 12:42 · 8 min read

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.

AttributeDetails
accept-charsetSpecifies the character encodings that are to be used for the form submission.
actionSpecifies where to send the form-data when a form is submitted.
autocompleteSpecifies whether a form should have autocomplete on or of
enctypeSpecifies how the form-data should be encoded when submitting it to the server (only for method="post").
methodSpecifies the HTTP method to use when sending form-data (POST or GET).
nameSpecifies the name of a form
novalidateSpecifies that the form should not be validated when submitted.
targetSpecifies where to display the response that is received after submitting the form.
<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">
AttributeDetails
_blankThe response is displayed in a new window or tab
_selfThe response is displayed in the same frame (this is default)
_parentThe response is displayed in the parent frame
_topThe response is displayed in the full body of the window
framenameThe response is displayed in a named iframe

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>

 

TAGS:






POST COMMENTS
No Comment

Please login to post comment




POPULAR POSTS

best free web hosting services...
what is new in miui 11?...
free website ssl security using cloudfla...
do you want to make money online?...
CSS3 @IMPORT RULES...
What is HTML Anchor Tag and Hyperlinks?...
How to host a web page in 10 minutes....
CSS3 RESPONSIVE UI...
Tables HTML...
CSS3 FUNCTIONS...
How to use CSS3 Overflow Property?...
CSS3 FILTERS...


RECENT COMMENTS

2022-03-05 11:05
By coder on XAMPP - MySQL shutdown unexpectedly | How to fix MySQL crash unexpectedly
2021-10-12 12:34
By abnongoke on do you want to make money online?
2021-10-12 12:34
By abnongoke on how to get a free website domain name?
2021-10-12 12:34
By solar panel for shed on what is new in miui 11?
2021-10-12 12:34
By solar panel for shed on best free web hosting services
2021-10-12 12:34
By amos tanui on free website ssl security using cloudflare


SOCIAL SHARE



FOLLOW US ON TWITTER



FOLLOW US ON FACEBOOK



FOLLOW US







Recent Blogs



Contact Us

Subscribe Our News-Letter



Kashipur, 244713
Uttarakhand, India



© www.prodevskill.com 2023. All Rights Reserved. Powered by Pro Developer