How to submit a form without a form identifier and submit identifier, but known hidden value?

Question

the situation I'm struggling with is that there are more forms on the page that look like this: (hiddenId differs in each form):

<form method="post"> <input type="hidden" name="hiddenId" value="111222"> <input type="submit" value="Proceed"> </form> <form method="post"> <input type="hidden" name="hiddenId" value="111333"> <input type="submit" value="Proceed"> </form> 

How do I submit using javascript (I don't mind using jQuery) a specific form that includes the hiddenId of the desired value? Thanks for the help!

Answer 1

Something in this direction should begin:

 var inputs = document.getElementsByTagName("input"); for(var i = 0; i < inputs.length; i++) { if(inputs[i].type === "hidden" && inputs[i].value === "111333") { inputs[i].form.submit(); } } 

If you can use jQuery:

 $("input[type='hidden'][value='something']").closest("form").submit(); 

Answer 2

document.forms is an array. document.forms[0] is the first.

Elements work the same way:

document.forms[0].elements[0].value , etc.

You can loop until you get the value, and then submit the current form:

 document.forms[x].submit() 

Answer 3

Access to all forms with var allForms = document.forms;

scroll them as needed to access inputs

Answer 4

You can use document.querySelector or one of the JavaScript libraries that emulate it in older browsers to find a hidden input element, and then use its form property to access the form and call the submit method.

Answer 5

You can add id to the form and send the button:

 <form method="post" id="form1"> <input type="hidden" name="hiddenId" value="111222"> <input type="submit" value="Proceed" id="submit1"> </form> <form method="post" id="form2"> <input type="hidden" name="hiddenId" value="111333"> <input type="submit" value="Proceed" id="submit2"> </form> 

Then use jQuery to submit the form:

 $("#submit1").click(function() { form1.submit(); } $("#submit2").click(function() { form2.submit(); }