HTML DOM Input Hidden Form Property



The HTML DOM input hidden form property returns the reference of the form that contain the hidden input field in the HTML document.

Syntax

Following is the syntax −

object.form

Example

Let us see an example of HTML DOM input hidden form property −

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
   body{
      text-align:center;
      background-color:#363946;
      color:#fff;
   }
   form{
      margin:2.5rem auto;
   }
   button{
      background-color:#db133a;
      border:none;
      cursor:pointer;
      padding:8px 16px;
      color:#fff;
      border-radius:5px;
      font-size:1.05rem;
   }
   .show{
      font-weight:bold;
      font-size:1.4rem;
   }
</style>
</head>
<body>
<h1>form Property Demo</h1>
<form id="Form 1">
<fieldset>
   <legend>Form 1</legend>
   Here is hidden input field: <input type="hidden" class="hiddenField">
</fieldset>
</form>
<button onclick="identify()">Identify Hidden Input Field</button>
<p class="show"></p>
<script>
   function identify() {
      var formId = document.querySelector(".hiddenField").form.id;
      document.querySelector(".show").innerHTML = "Hi! I'm from " + formId;
   }
</script>
</body>
</html>

Output

This will produce the following output −

Click on “Identify Hidden Input Field” button to identify the form which contain the hidden input field.

Updated on: 2019-07-30T22:30:26+05:30

136 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements