HTML formenctype Attribute

If this site has been useful, we’d love your support! Consider buying us a coffee to keep things going strong!

Description

The formenctype attribute in HTML is used to define how form data should be encoded before it's sent to the server when a form is submitted. This attribute is particularly useful when you have a form that includes file uploads.

Here's a breakdown of key points about formenctype:

Applies to submit buttons: It can only be used on <button> or <input> elements with the type attribute set to "submit" or "image".
Overrides form's enctype: The formenctype attribute on a submit button overrides the enctype attribute that's set on the <form> element itself.
Specifying encoding type: It allows you to specify the encoding type for the form data. Common encoding types include:
- application/x-www-form-urlencoded (default): This is the default encoding type and encodes most characters before sending them to the server.
- multipart/form-data: This encoding type is specifically used for file uploads and doesn't encode any characters.
- text/plain: This encoding type encodes spaces but not other special characters.

In essence, formenctype gives you more control over how data from a specific submit button is encoded within a form. This can be helpful depending on how the server-side script expects to receive the data.

Syntax

<tagname type="submit" 
         formenctype="application/x-www-form-urlencoded | multipart/form-data | text/plain">

Values

application/x-www-form-urlencodedThis is the default encoding type. Data is encoded as name/value pairs, similar to the format of query strings in URLs. This type is suitable for forms that only include text fields.
multipart/form-dataThis encoding type is used when the form includes any <input type="file"> elements, i.e., when files are to be uploaded. It allows files to be sent to the server along with the text data. Each file or piece of text is sent as a block of data ("part") within a larger message, with each part being separated by a unique boundary. This is the only encoding type that supports file uploads.
text/plainThis encoding type sends the data without any encoding at all. Each value is sent as plain text, with spaces converted into "+" symbols and no other encoding performed. It's rarely used in practice and is generally not recommended for most web applications.

Applies To

Example

HTML

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

  Name:<br><input type="text" name="name"><br><br>

  File:<br><input type="file" name="myfile"> <br><br>

  <button type="submit" formenctype="multipart/form-data">Upload Image</button>

</form>

Result

Editor

Browser Support

The following information will show you the current browser support for the HTML formenctype attribute. Hover over a browser icon to see the version that first introduced support for this HTML attribute.