Submit a form from another form

Question

I'm trying to submit form from another form.

I'm clicking on NEXT, but form "navForm" doesn't submit.

echo $_POST['check_if_send'];
<form method='post' action='index.php?page=home&act=multi_edit' name='mainTable'>
    <a href="#" class="form_arrows left" onClick="document.getElementById('mainTable').submit()">Multi Update</a>
    <a href="index.php?page=home&amp;value=n&amp;startRow=10" class="form_arrows " onClick="document.getElementById('navForm').submit()">Previous</a>
    <a href="index.php?page=home&amp;value=p&amp;startRow=10" class="form_arrows " onClick="document.getElementById('navForm').submit()">Next</a>
</form>
<form method='post' action='index.php?page=home&act=search' id="navForm" name="navForm">
    <input type='hidden' name='check_if_send' value='some_value'  />

Submit

Does it work if you create a submit button in navForm and invoke the click event on that button ? — dhalfageme, Jul 14 '14 at 08:14
Your href may override your onclick. Add "return false" after the call to submit(). See also this answer : http://stackoverflow.com/a/11348403/911718 — Kevin Labécot, Jul 14 '14 at 08:16

mplungjan · Answer 1 · 2014-07-14T11:35:25.903

you are not submitting from another form. "A" is not a form element.
you do not change the form action just by having it in the href of the achor
return false from the onclick so you do not reload the page:

    <a href="#" class="form_arrows left" 
    onClick="document.getElementById('mainTable').submit(); 
    return false">Multi Update</a>

perhaps you meant

function nav(idx) {
  var form = document.getElementById('navForm'),
      url = "index.php?page=home&amp;value=n&amp;startRow="+idx;
  form.action=url; 
  form.submit();
  return false;
}
window.onload=function() {
  document.getElementById("previous").onclick=document.getElementById("next").onclick=function() {
  nav(this.getAttribute("data-idx"));
  }
}

using

<a href="#" class="form_arrows" id="prev" data-idx="0">Previous</a>
<a href="#" class="form_arrows" id="next" data-idx="10">Next</a>

or

function nav(link) {
  var form = document.getElementById('navForm');
  form.action=link.href; 
  form.submit();
  return false;
}
window.onload=function() {
  var links = document.querySelectorAll(".form_arrows");
  for (var i=0;i<links.length;i++) links[i].onclick=function() {
    nav(this);
  }
}

using

<a href="index.php?page=home&amp;value=n&amp;startRow=0" class="form_arrows" id="prev">Previous</a>
<a href="index.php?page=home&amp;value=p&amp;startRow=10" class="form_arrows" id="next">Next</a>

Why? You do not have a target in the form so the link will likely disrupt the form submission or vice versa - see my update for alternative — mplungjan, Jul 14 '14 at 11:33

Submit a form from another form

1 Answers1