HTML DOM Form enctype प्रॉपर्टी

HTML DOM Form enctype प्रॉपर्टी फॉर्म एलिमेंट के enctype एट्रिब्यूट से जुड़ी होती है। यह प्रॉपर्टी फॉर्म के enctype एट्रिब्यूट मान को सेट या वापस करती है। enctype एट्रिब्यूट का उपयोग केवल तभी किया जाता है जब method एट्रिब्यूट मान "POST" हो। enctype प्रॉपर्टी का उपयोग यह निर्दिष्ट करने के लिए किया जाता है कि सबमिट किए जाने वाले फॉर्म में डेटा को एन्कोड किया जाना चाहिए।

सिंटैक्स

Enctype प्रॉपर्टी सेट करने का सिंटैक्स:

formObject.enctype = encoding

यहां, encoding "application/x-www-form-urlencoded" हो सकता है, जिसका अर्थ है कि भेजने से पहले सभी वर्ण एन्कोड किए जाते हैं और यह डिफ़ॉल्ट एन्कोडिंग है।

दूसरा है "multipart/form-data", जो निर्दिष्ट करता है कि किसी भी वर्ण को एन्कोड नहीं किया जाना चाहिए और इसका उपयोग सर्वर पर फाइलें अपलोड करने के लिए किया जाता है।

तीसरा एन्कोडिंग "text/plain" है और यह केवल स्पेस को "+" सिंबल में बदलता है और कोई अन्य एन्कोडिंग नहीं करता। text/plain एन्कोडिंग का उपयोग नहीं किया जाना चाहिए क्योंकि यह सुरक्षित नहीं है।

उदाहरण

Form enctype प्रॉपर्टी का एक उदाहरण देखते हैं:

<!DOCTYPE html> <html> <head> 
<style> 
  form{ 
    border:2px solid blue; 
    margin:2px; 
    padding:4px; 
  } 
</style> 
<script> 
  function changeEnc() { 
    document.getElementById("FORM1").enctype = "application/x-www-form-urlencoded"; 
    document.getElementById("Sample").innerHTML = "The enctype attribute value is now 'application/x-www-form-urlencoded'"; 
  } 
</script> </head> <body> 
<h1>Form enctype property example</h1> 
<form id="FORM1" method="post" enctype="multipart/form-data"> 
  <label>User Name <input type="text" name="usrN"></label> <br><br> 
  <label>Password <input type="password" name="pass"></label> 
</form> 
<br> 
<button onclick="changeEnc()">CHANGE</button> 
<p id="Sample"></p> 
</body> </html>

आउटपुट

यह निम्नलिखित आउटपुट उत्पन्न करेगा:

HTML DOM Form enctype प्रॉपर्टी

CHANGE बटन पर क्लिक करने पर:

HTML DOM Form enctype प्रॉपर्टी

उदाहरण की व्याख्या

हमने id="Form1", method="post" और enctype को "multipart/form-data" पर सेट करके एक फॉर्म बनाया है। enctype फॉर्म डेटा के लिए एन्कोडिंग प्रकार निर्दिष्ट करता है और हमारे मामले में यह "multipart/form-data" पर सेट है। यह एन्कोडिंग सर्वर पर फाइल अपलोड के लिए उपयोगी है। फॉर्म में एक टेक्स्ट फील्ड और एक पासवर्ड फील्ड भी है।
फिर हमने एक CHANGE बटन बनाया जो यूजर द्वारा क्लिक किए जाने पर changeEnc() मेथड को एक्जीक्यूट करता है।
changeEnc() मेथड getElementById() मेथड का उपयोग करके फॉर्म एलिमेंट को प्राप्त करता है और इसके enctype प्रॉपर्टी को "application/x-www-form-urlencoded" पर सेट करता है। यह हमारे सभी वर्णों को एन्कोड करता है और यह डिफ़ॉल्ट enctype एन्कोडिंग है। id "Sample" वाले पैराग्राफ की innerHTML प्रॉपर्टी का उपयोग करके हम इस परिवर्तन को यूजर को टेक्स्ट प्रदर्शित करके दिखाते हैं।

function changeEnc() { 
  document.getElementById("FORM1").enctype = "application/x-www-form-urlencoded"; 
  document.getElementById("Sample").innerHTML = "The enctype attribute value is now 'application/x-www-form-urlencoded'"; 
}