title: jQuery - submit multiple forms through single request, without Ajax
body: <p>I have a page with several forms.
  I am trying to submit one of the forms (say form A) (NOT through Ajax, since I need to load the result page after the submit is processed), BUT I need another form's contents (say form B) to be submitted TOGETHER with form A, i.e. the contents of forms A + B should be submitted TOGETHER to the SAME URL, as one request, and as I said before, NOT as an Ajax request.</p>
  <p>The submit should be by a POST request. Also, the forms contain ONLY fields that are not file upload (i.e. input, select, textarea fields).</p>
  <p>I have seen suggestions here such as</p>
  <p><a href="https://stackoverflow.com/questions/315912/posting-submitting-multiple-forms-in-jquery">Posting/submitting multiple forms in jQuery</a></p>
  <p>or</p>
  <p><a href="https://stackoverflow.com/questions/5932451/submitting-two-forms-with-a-single-button">Submitting two forms with a single button</a></p>
  <p>but pay attention that these do not match my case, since the forms are submitted in different requests, and/or they are submitted through Ajax.</p>
  <p>I was thinking of getting the contents of one of the forms by (the jQuery's) serialize(), but how do I attach that string to a form submitted by POST?</p>
  <p>Or maybe you have other ideas how to accomplish this?</p>
  <p><strong>SOLUTION:</strong></p>
  <p>Based on the ideas of Sheepy, I wrote the following code. I am also using the answer by Pointy from the following link:</p>
  <p><a href="https://stackoverflow.com/questions/2368593/submit-multiple-forms-to-same-page">submit multiple forms to same page</a></p>
  <pre><code>//Arguments: &quot;name&quot;s of forms to submit.
  //First argument: the form which according to its &quot;action&quot; all other forms will be submitted.
  //Example: mergeForms(&quot;form1&quot;,&quot;form2&quot;,&quot;form3&quot;,&quot;form4&quot;)
  function mergeForms() {
      var forms = [];
      $.each($.makeArray(arguments), function(index, value) {
          forms[index] = document.forms[value];
      });
      var targetForm = forms[0];
      $.each(forms, function(i, f) {
          if (i != 0) {
              $(f).find('input, select, textarea')
                  .hide()
                  .appendTo($(targetForm));
          }
      });
      $(targetForm).submit();
  }
  </code></pre>