HTML formenctype Attribute

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

The formenctype attribute can be used on the following html elements.

Example

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

Browser Support

The following table will show you the current browser support for the HTML formenctype Attribute.

Desktop
Edge Chrome Firefox Opera Safari
YesYesYesYesYes
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview
YesYesYesYesYesYes

Last updated by CSSPortal on: 29th March 2024