HTML DOM Input Submit formEnctype property

HTMLWeb DevelopmentFront End Technology

The HTML DOM Submit formEnctype property is used for setting or returning the formEnctype attribute value of a submit button. It introduced in HTML5 for input element with type submit. It is used for specifying how the data of the form should be encoded when submitted to the server.

This property only works if there is method=”post” property. The formEnctype attribute value overrides the enctype attribute value associated with the <form> element

Syntax

Following is the syntax for −

Setting the submit formEnctype property −

submitObject.enctype = encoding

Here, encoding can be “application/x-www-form-urlencoded” which means all characters are encoded before sent and this is the default encoding. Another one is “multipart/form-data” which specifies that no character should be encoded and is used for uploading files to the server. The third encoding is “text/plain” and it only converts space to “+” symbol and no other encoding. The text./plain encoding shouldn’t be used as it is not secure.

Example

Let us look at an example for the submit formEnctype property −

Live Demo

<!DOCTYPE html>
<html>
<head>
<script>
   function changeEnc() {
      document.getElementById("SUBMIT1").formEnctype = "application/x-www-formurlencoded";
      document.getElementById("Sample").innerHTML = "The formenctype attribute value is now 'application/x-www-form-urlencoded' ";
   }
</script>
</head>
<body>
<h1>Submit formEnctype property example</h1>
<form id="FORM_1" action="/Sample.php" style="border:solid 2px green;padding:2px">
UserName: <input type="text" id="USR"> <br>
Location: <input type="text" id=“Loc”> <br><br>
<input type="submit" id="SUBMIT1" formenctype="multipart/form-data">
</form>
<br>
<button onclick="changeEnc()">CHANGE</button>
<p id="Sample"></p>
</body>
</html>

Output

This will produce the following output −

On clicking the CHANGE button −

raja
Published on 19-Aug-2019 11:12:25
Advertisements