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.

karthikeya Boyini
karthikeya Boyini

I love programming (: That's all I know

Updated on: 30-Jul-2019

81 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements