HTML DOM Select form Property - पैरेंट फॉर्म प्राप्त करें

HTML DOM Select form Property

HTML DOM select form property उस फॉर्म का रेफरेंस लौटाता है जिसमें ड्रॉप-डाउन सूची समाहित है। यदि ड्रॉप-डाउन किसी फॉर्म के अंदर नहीं है, तो यह null लौटाता है।

Syntax

selectObject.form

उदाहरण

ड्रॉप-डाउन को समाहित करने वाले फॉर्म की पहचान करना:

<!DOCTYPE html>
<html>
<head>
<style>
  body {
    text-align: center;
    background-color: #363946;
    color: #fff;
  }
  form {
    margin: 2.5rem auto;
    border: 1px solid #fff;
    padding: 2rem;
  }
  .drop-down {
    display: block;
    width: 35%;
    border: 2px solid #fff;
    font-weight: bold;
    padding: 2px;
    margin: 1rem auto;
    outline: none;
  }
  button {
    background-color: #db133a;
    border: none;
    cursor: pointer;
    padding: 8px 16px;
    color: #fff;
    border-radius: 5px;
    font-size: 1.05rem;
    outline: none;
  }
  .show { font-weight: bold; font-size: 1.4rem; }
</style>
</head>
<body>
<h1>form Property Demo</h1>
<form id="Form 1">
  <legend style="font-weight:bold;">Form 1</legend>
  <p>नमस्ते, अपना पसंदीदा विषय चुनें:</p>
  <select class='drop-down' name="Drop Down List">
    <option>Physics</option>
    <option>Maths</option>
    <option>Chemistry</option>
    <option>English</option>
    <option>Economics</option>
    <option>Hindi</option>
    <option>Biology</option>
  </select>
</form>
<button onclick="identify()">ड्रॉप-डाउन के फॉर्म की पहचान करें</button>
<p class="show"></p>
<script>
  function identify() {
    var formId = document.querySelector(".drop-down").form.id;
    document.querySelector(".show").innerHTML = "नमस्ते! मैं " + formId + " से हूँ";
  }
</script>
</body>
</html>

आउटपुट

"ड्रॉप-डाउन के फॉर्म की पहचान करें" बटन क्लिक करने पर "नमस्ते! मैं Form 1 से हूँ" संदेश प्रदर्शित होता है।

मुख्य बिंदु

• form property केवल पढ़ने के लिए है (read-only)
• यह उस <form> एलिमेंट का रेफरेंस लौटाता है जो ड्रॉप-डाउन का पूर्वज (ancestor) है
• यदि ड्रॉप-डाउन किसी फॉर्म के बाहर है, तो यह null लौटाता है
• फॉर्म के अंदर नेस्टेड ड्रॉप-डाउन के लिए उपयोगी - फॉर्म ऑब्जेक्ट तक पहुंच के लिए
• select.form.id, select.form.name, select.form.elements आदि एक्सेस कर सकते हैं