title: submit two form contents onto one action page
body: <p>i have two Forms to be submitted to a single destination page.</p>
  
  <pre><code>&lt;form name= "form1" id="form1" action="final.php"&gt;
  &lt;input type="box1" name="box1" value="" &gt;
  &lt;/form&gt;
  
  &lt;form name ="form2" id="form2" action="final.php"&gt;
  &lt;table&gt;
  &lt;input type ="text" id="txt_1"  name ="txt_1" value=""&gt;
  
   ...
  
  
  &lt;/table&gt;
  &lt;/form&gt;
  
  &lt;input type= "button" name="mybutton" id="mybutton" onclick="somefunction();"&gt;
  </code></pre>
  
  <p>here ,</p>
  
  <p>form1 has some satic contents </p>
  
  <p>and </p>
  
  <p>form2 has a table which is dynamically generated by js...
  problem is ...i want to submitted values from both the forms to same page final.php ...how cud i do it .....pls avoid jquery/ajax...
  simple javascript welcomed ...</p>
  
  <p>thanks in advance ! </p>
  
  <hr>
  
  <p>this is the js for generating dynamic table in form2</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  
  function viewsource() {
  alert(document.body.innerHTML);
  }
  &lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  
  function addRowToTable()
  {
     var tbl = document.getElementById('tblSample');
     var frm=document.form2;
     if (!frm.ary) frm.ary=[frm.t1_1,frm.t1_2,frm.t1_3];
     var lastRow = tbl.rows.length;
     // if there's no header row in the table, then iteration = lastRow + 1
    var iteration = lastRow;
    var row = tbl.insertRow(lastRow);
  
  
  
     // numberd row
      var cellLeft = row.insertCell(0);
      var textNode = document.createTextNode(iteration);
      cellLeft.appendChild(textNode);
  
      // Item row
       var cellRight1 = row.insertCell(1);
       var el1 = document.createElement('input');
       frm.ary.push(el1);
       el1.type = 'text';
       el1.value = '';
       el1.name = 't' + iteration + '_1';
       el1.id = 't' + iteration + '_1';
       el1.size = 13;
       el1.onkeyup=Calc;
       el1.onblur=Calc;
       cellRight1.appendChild(el1);
  
    // Price row
      var cellRight2 = row.insertCell(2);
         var el2 = document.createElement('input');
      frm.ary.push(el2);
       el2.type = 'text';
       el2.value = '';
      el2.name = 't' + iteration + '_2';
      el2.id = 't' + iteration + '_2';
      el2.size = 10;
      el2.onkeyup=Calc;
      el2.onblur=Calc;
      cellRight2.appendChild(el2);
  
      // Price row
      var cellRight3 = row.insertCell(3);
      var el3 = document.createElement('input');
      frm.ary.push(el3);
      el3.type = 'text';
      el3.value = '0';
      el3.name = 't' + iteration + '_3';
      el3.id = 't' + iteration + '_3';
      el3.size = 10;
      cellRight3.appendChild(el3);
  
    }
  
    function removeRowFromTable()
    {
        var tbl = document.getElementById('tblSample');
        var lastRow = tbl.rows.length;
       if (lastRow &gt; 3) tbl.deleteRow(lastRow - 1);
    }
  
     function formReset()
      {
        document.getElementById("form2").reset();
       }
    &lt;/script&gt;
  
    &lt;script type="text/javascript"&gt;
  
  
      function Calc(){
     var frm=document.form2;
      if (!frm.ary){ frm.ary=[frm.t1_1,frm.t1_2,frm.t1_3];}
         for (var zxc0=0;zxc0&lt;frm.ary.length;zxc0+=3)
       {
        var total =1;
       if (frm.ary[zxc0].value.length&gt;0&amp;&amp;!isNaN(frm.ary[zxc0].value)) 
       { 
       total =frm.ary[zxc0].value*1* frm.ary[zxc0+1].value;
       }
        frm.ary[zxc0+2].value =total;
  
        }
       var sum1 =0;
       for (var zxd0=0;zxd0&lt;frm.ary.length;zxd0+=3)
       {
         if (frm.ary[zxd0+2].value.length&gt;0&amp;&amp;!isNaN(frm.ary[zxd0+2].value)) 
      { 
      sum1 +=parseInt(frm.ary[zxd0+2].value);
         }
        }
        frm.sum.value = sum1;
       }
  
  
      &lt;/script&gt;
  
  
     &lt;form action="final.php" method="post" name="form2" id="form2"&gt;
      &lt;imput type ="text" name ="temp" id="temp" &gt;
     &lt;table border="2"  border-color="#000000" border-type="solid" id="tblSample"            
     align="center" font-size="20"&gt;
      &lt;tr&gt;
      &lt;th&gt;
       &lt;input type="button" value="Add " onclick="addRowToTable();"&gt;&lt;/th&gt;&lt;th&gt;
       &lt;input  type="button" value="Remove " onclick="removeRowFromTable();" /&gt;&lt;/th&gt;
      &lt;th&gt; &lt;input type="button" value="Reset" onclick="formReset();"&gt;
     &lt;/th&gt;
  
      &lt;/tr&gt;&lt;br&gt;
  
        &lt;tr id="cloneid" &gt;
           &lt;td&gt;
           1.
         &lt;/td&gt;
          &lt;td&gt;
      &lt;input type="text" name="t1_1" id="t1_1" size="16" value="0" onkeyup="Calc();"   
        onblur="Calc();"&gt;
        &lt;/td&gt;
       &lt;td&gt;
        &lt;input type="text" name="t1_2" id="t1_2" size="16" value="0" onkeyup="Calc();"    
       onblur="Calc();"&gt;
       &lt;/td&gt;
      &lt;td&gt;
        &lt;input type="text" name="t1_3" id="t1_3" value= "0" size="16"&gt;
         &lt;/td&gt;
  
     &lt;/tr&gt;
        &lt;/table&gt;
      &lt;table border="2" border-color="#000000" align="center"&gt;
   &lt;tr&gt;
     &lt;td colspan="3" align="center"&gt;
    Sum: &lt;input type="text" name="sum" id="sum"&gt;
    &lt;/td&gt;
  
     &lt;/tr&gt;
      &lt;/table&gt;
    &lt;/form&gt;
  
   &lt;input type="button" name = "mybutton" id ="mybutton"  value="set"  
       onclick="somefunction();"&gt;
  
       }
  </code></pre>
  
  <p>and </p>
  
  <p>form1 is same as mentioned including jquery for datetimepickers along witha  couple of text boxes...</p>