How to submit a specific form if multiple forms are present in one page using jquery

Question

I have two forms.

<form name="frm1" action="someurl" method="post">
  <input type="submit" name="btn1" class="buttons" value="Submit"/>
</form>

and

<form name="frm2">
  <input type="submit" name="btn2" value="Submit"/>
</form>

I need to submit form "frm1" on click of "btn2" of form "frm2".

Answer 1

<button type="submit" form="form1" value="Submit">Submit</button>

The form attribute specifies the id of the form that the button will submit.

Answer 2

HTML

<form name="frm1" action="someurl" method="post" id="frm1">
<input type="submit" name="btn1" class="buttons" value="Submit"/>
</form>


<input type="submit" name="btn2" onclick="formSubmit()" value="Submit"/>

Javascript

<script>
function formSubmit()
{
document.getElementById("frm1").submit();
}
</script>

Answer 3

consider the HTML:

    <form id="target" action="destination.html">
    <input type="text" value="Hello there" />
    <input type="submit" value="Go" />
    </form>
    <div id="other">
    ....
    </div>

The event handler can be bound to the form:

    $('#target').submit(function() {
    alert('Handler for .submit() called.');
    return false;
    });

Click function:

    $('#other').click(function() {
    $('#target').submit();
    });

Here is the link have a look: How can I submit form on button click when using preventDefault()?