How to submit a specific form if multiple forms are present on the same page using jquery

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 the form "frm1" when I click "btn2" of the form "frm2".

+6
source share
6 answers

would you say

<input type="submit" name="btn1" id="btn1" value="Submit"/>

  $("#btn1").click(function(){ $("#frm1").submit(); } 

and

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

  $("#btn2").click(function(){ $("#frm1").submit(); } 
+10
source
 <button type="submit" form="form1" value="Submit">Submit</button> 

The form attribute indicates the id form the button will send.

+11
source

consider HTML:

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

An event handler can be attached to the form:

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

Press function:

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

Here is the link: How to submit a form when a button is clicked when using the preventDefault () function?

+2
source

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> 
+2
source

You can use ajax to submit the first form before the second:

 $('form[name=frm2]').submit(function() { var form1 = $('form[name=frm1]'); $.ajax({ type: "POST", url: form1.attr('action'), data: form1.serialize(), async: false; }); }); 
+1
source

I usually avoid the .submit () function, since I almost always have to do something more with an answer that would allow me to allow .submit ().

Thus, the non.submit option, in which you must enter the SUBMIT buttons, must be replaced with regular buttons.

 $('.btn2').bind('click', function(){ var form1Data = $('#frm1').serialize(); $.ajax({ url : 'someurl', type : 'post', datatype : 'json', data : form1Data, success : function(json) { sumbitForm2(); } }); }); function submitForm2() { var form2Data = $('#frm2').serialize(); $.ajax({ url : 'urlToSumbitForm1', type : 'post', datatype : 'json', data : form2Data, success : function(json) { //do something if you need to } }); } 
0
source

All Articles