- HTML Basics
- HTML Home
- HTML Basics
- HTML Document Structure
- HTML Data Types
- HTML Attributes
- HTML Fonts
- HTML Headings
- HTML Character Entities
- HTML Horizontal Line
- HTML Line Break
- HTML Paragraph
- HTML Citation Definition
- HTML Quotations
- HTML Comments
- HTML Styles
- HTML Formatting
- HTML CSS
- HTML Tags
- HTML Basic Tags
- HTML All Tags
- HTML Root Tags
- HTML Metadata Tags
- HTML Section Tags
- HTML Head Heading Tags
- HTML Flow Tags
- HTML Phrasing Tags
- HTML Embedded Tags
- HTML Interactive Tags
- HTML Meta Tags
- HTML Texts
- HTML Text Formatting
- HTML Physical Style Text
- HTML Logical Style Text
- HTML Organizing Text
- HTML Arranging Text
- HTML Displaying Lists
- HTML List
- HTML Links Tables
- HTML Links URLs
- HTML Links
- HTML URL Encode
- HTML Tables
- HTML Images Colors
- HTML Images Colors
- HTML Images
- HTML Color Codes
- HTML Canvas
- HTML Backgrounds
- HTML Forms
- HTML Forms
- HTML Form Tag
- HTML Input Tag
- HTML Button Tag
- HTML Multiple-Choice
- HTML Select Tag
- HTML Option Tag
- HTML Optgroup Tag
- HTML Textarea Label
- HTML Fieldset Legend
- HTML Datalist Tag
- HTML Keygen Tag
- HTML Output Tag
- HTML Progress Tag
- HTML Meter Tag
- HTML Submit Form
- HTML enctype Attribute
- HTML action Attribute
- HTML Method Attribute
- HTML Get Method
- HTML Post Method
- HTML Interactive
- HTML Interactive Web
- HTML Details Summary
- HTML Menu Tag
- HTML Command Tag
- HTML KBD Tag
- HTML Time Tag
- HTML Multimedia
- HTML Multimedia
- HTML Multimedia Tags
- HTML Audio Video
- HTML Embedded Multimedia
- HTML EMBED Tag
- HTML OBJECT Tag
- HTML FIGURE FIGCAPTION
- HTML Advance
- HTML Blocks
- HTML Classes
- HTML Iframes
- HTML JavaScript
- HTML Layouts
- HTML Responsive
- HTML Test
- HTML Online Test
- Give Online Test
- All Test List
HTML enctype Attribute
The enctype attribute is used to encode the information in the form before sending it to the server so that the information is not corrupted during the transmission. The encoding is performed by the browser.
Three types of encoding process are application/x-www-form-urlencoded, multipart/form-data, and text/plain.
The application/x-www-form-urlencoded encoding is the standard form of encoding. If no value is set for the enctype attribute, browser accepts the standard type.
The multipart/form-data encoding is required for those forms that contain file selection field.
You can use the text/plain attribute along with the mailto URL to send the form information to an e-mail address rather than a server.
The application/x-www-form-urlencoded Encoding
The application/x-www-form-urlencoded encoding acts as a default type of encoding for the browser. This implies that if the enctype attribute is not set with any value, the browser by default uses the application/x-www-form-urlencoded encoding.
In this encoding, the browser converts a space into a a plus sign (+), a non-alphanumeric character into a percent sign (%) followed by two hexadecimal digits that are ASCII code of character, and line breaks into CR/LF pairs (%0D%0A).
The standard encoding also contains the name of each form controls that is present in the form. Each control name is separated from other control name by an ampersand (&).
Example of application/x-www-form-urlencoded Encoding
Let's consider a form, which contains four controls named username, password, name, and address. The values of these controls are richjones, rich23, richard, and Sydney, Australia respectively. In such a case, the encoding of the information in the form is done in the following way :
Username=richjones&password=rich23&name=richard&address=Sydney,+Australia
The multipart/form-data Encoding
The multipart/form-data encoding is used only when the method attribute of the form is set to post. In this type of encoding, the controls in the form are segregated in several parts. This encoding is more cumbersome and longer than the application/x-www-form-urlencoded encoding.
Example of multipart/form-data Encoding
Let's consider the example used in the application/x-www-form-urlencoded encoding. The form contains four controls named username, password, name, and address, and their values are richjones, rich23, richard, and Sydney, Australia, respectively. The encoding of the given example in the multipart/form-data encoding is as follows:
-----------------------------------------------------------1234567897987 Content-Disposition: form-data; name="username" richjones -----------------------------------------------------------1234567897987 Content-Disposition: form-data; name="password" rich23 -----------------------------------------------------------1234567897987 Content-Disposition: form-data; name="name" richard -----------------------------------------------------------1234567897987 Content-Disposition: form-data; name="address" Sydney, Australia -----------------------------------------------------------1234567897987
As already discussed this type is preferred only when the form contains one or more file selection control. Let's consider an example where the form contains a file selection control named thefile and the filename is file. In this case, the multipart/form-data encoding is given as follows:
-----------------------------------------------------------1234567897987 Content-Disposition: form-data; name="thefile"; filename="file" Content of the file... -----------------------------------------------------------1234567897987
The text/plain Encoding
The text/plain encoding is used when the browser does not have access to the server that contains the form-handling program. In this case, the information form the form is sent through an e-mail and the action attribute is set to a mailto URL. In this type of encoding, each control is written in a single line, with name and value separated by an equal to sign (=). Space is denoted by space and line break is denoted by CR/LF pairs (%0D%0A).
Example of text/plain Encoding
Let's again consider the example used in the application/x-www-form-urlencoded encoding in which, there are four controls named username, password, name, and address. The encoding of the information in the form is given as follows:
username=richjones password=rich23 name=richard address=Sydney, Australia
« Previous Tutorial Next Tutorial »