Teach with us

HTML DOM Fieldset form property

The HTML DOM Fieldset form property returns the form reference of the type form object. This is for the <fieldset> element that is present inside that given form. It is a read-only property. If the specified fieldset isn’t present inside the form then null is returned

Syntax

Following is the syntax for the fieldset form property −

fieldsetObject.form

Example

Let us look at an example for the fieldset form property −

<!DOCTYPE html>
<html>
<head>
<script>
   function formId() {
      var field = document.getElementById("FieldSet1").form.id;
      document.getElementById("Sample").innerHTML = "The id of the form in which fieldset
      element is present is "+field;
   }
</script>
</head>
<body>
<h1>Sample FORM</h1>
<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>
<br>
<button onclick="formId()">GET ID</button>
<p id="Sample"></p>
</body>
</html>

Output

This will produce the following output −

On clicking the GET ID button −

In the above example −

We have first created a <form> element with id “FORM1” that contains a <fieldset> element having id “FieldSet1” −

<form id="FORM1">
<fieldset id="FieldSet1">
<legend>User Data:</legend>
Name:<input type="text"><br>
Address:<input type="text"><br>
Age:<input type="text">
</fieldset>
</form>

We have then created a button GET ID that will execute the formId() function on being clicked by the user −

<button onclick="formId()">GET ID</button>

The formId() function gets the fieldset element using the getElementById() and then get its form.id property which returns the form id in which the given fieldset element is present. The form.id returned value is assigned to the field variable. The variable is then displayed in the paragraph that has id “Sample” associated with it and using its innerHTML property to assign the intended text −

function formId() {
   var field = document.getElementById("FieldSet1").form.id;
   document.getElementById("Sample").innerHTML = "The id of the form in which fieldset element is    present is "+field;
}
Updated on 19-Aug-2019 06:57:00

0 Views

Tutorials Point

Previous Page Next Page  
Advertisements