The job is to select the <form> element from the given <input> element of the form. Here few of the important techniques are discussed. We are going to use JavaScript.
Approach:
- First select the <input> element of the form.
- Use one of the .form property or .closest(‘form’) method to get access to the parent form element.
Example 1: This example uses the approach discussed above and uses .form property.
html
<script src= </script> <h1 style="color:green;"> neveropen </h1> <p id="GFG_UP"></p> <form id="formElement"> Input_1: <input id="input1" type="text" /> <br> <input type="checkbox" name="input_2"> Input_2 </form> <br> <button onclick="GFG_Fun()"> click here </button> <p id="GFG_DOWN"></p> <script> var el_up = document.getElementById('GFG_UP'); var el_down = document.getElementById('GFG_DOWN'); var input = document.getElementById('input1'); el_up.innerHTML = "Click on the button to select the " + "form element from the input element."; function GFG_Fun() { var form = input.form; el_down.innerHTML = "Id of form is '" + $(form).attr("id") + "'"; } </script> |
Output:
Get access to the containing form of an input
Example 2: This example uses the approach discussed above and using .closest() method.
html
</script> <h1 style="color:green;"> neveropen </h1> <p id="GFG_UP"></p> <form id="formElement"> Input_1: <input id="input1" type="text" /> <br> <input type="checkbox" name="input_2"> Input_2 </form> <br> <button onclick="GFG_Fun()"> click here </button> <p id="GFG_DOWN"></p> <script> var el_up = document.getElementById('GFG_UP'); var el_down = document.getElementById('GFG_DOWN'); var input = document.getElementById('input1'); el_up.innerHTML = "Click on the button to select the "+ "form element from the input element."; function GFG_Fun() { var form = $(input).closest('form'); el_down.innerHTML = "Id of form is '" + $(form).attr("id") + "'"; } </script> |
Output:
Get access to the containing form of an input
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!
