Javascript 在一个操作页面上提交两个表单内容

我有两个表格要提交到一个目标页面

<form name= "form1" id="form1" action="final.php">
<input type="box1" name="box1" value="" >
</form>

<form name ="form2" id="form2" action="final.php">
<table>
<input type ="text" id="txt_1"  name ="txt_1" value="">

 ...


</table>
</form>

<input type= "button" name="mybutton" id="mybutton" onclick="somefunction();">

...

这里,

表格1有一些讽刺的内容

及

form2有一个由js动态生成的表。。。 问题是…我想将两个表单中的值提交到同一个页面final.php…我是如何做到的…请避免使用jquery/ajax。。。 欢迎使用简单javascript

提前谢谢

---

这是用于在form2中生成动态表的js

<script type="text/javascript">

function viewsource() {
alert(document.body.innerHTML);
}
</script>
<script type="text/javascript">

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 > 3) tbl.deleteRow(lastRow - 1);
  }

   function formReset()
    {
      document.getElementById("form2").reset();
     }
  </script>

  <script type="text/javascript">


    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<frm.ary.length;zxc0+=3)
     {
      var total =1;
     if (frm.ary[zxc0].value.length>0&&!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<frm.ary.length;zxd0+=3)
     {
       if (frm.ary[zxd0+2].value.length>0&&!isNaN(frm.ary[zxd0+2].value)) 
    { 
    sum1 +=parseInt(frm.ary[zxd0+2].value);
       }
      }
      frm.sum.value = sum1;
     }


    </script>


   <form action="final.php" method="post" name="form2" id="form2">
    <imput type ="text" name ="temp" id="temp" >
   <table border="2"  border-color="#000000" border-type="solid" id="tblSample"            
   align="center" font-size="20">
    <tr>
    <th>
     <input type="button" value="Add " onclick="addRowToTable();"></th><th>
     <input  type="button" value="Remove " onclick="removeRowFromTable();" /></th>
    <th> <input type="button" value="Reset" onclick="formReset();">
   </th>

    </tr><br>

      <tr id="cloneid" >
         <td>
         1.
       </td>
        <td>
    <input type="text" name="t1_1" id="t1_1" size="16" value="0" onkeyup="Calc();"   
      onblur="Calc();">
      </td>
     <td>
      <input type="text" name="t1_2" id="t1_2" size="16" value="0" onkeyup="Calc();"    
     onblur="Calc();">
     </td>
    <td>
      <input type="text" name="t1_3" id="t1_3" value= "0" size="16">
       </td>

   </tr>
      </table>
    <table border="2" border-color="#000000" align="center">
 <tr>
   <td colspan="3" align="center">
  Sum: <input type="text" name="sum" id="sum">
  </td>

   </tr>
    </table>
  </form>

 <input type="button" name = "mybutton" id ="mybutton"  value="set"  
     onclick="somefunction();">

     }

函数viewsource（）{
警报（document.body.innerHTML）；
}
函数addRowtTable（）
{
var tbl=document.getElementById（'tblSample'）；
var frm=document.form2；
如果（！frm.ary）frm.ary=[frm.t1_1，frm.t1_2，frm.t1_3]；
var lastRow=tbl.rows.length；
//如果表中没有标题行，则迭代=lastRow+1
var迭代=最后一行；
变量行=tbl.insertRow（最后一行）；
//第几行
var cellLeft=行插入单元格（0）；
var textNode=document.createTextNode（迭代）；
cellLeft.appendChild（textNode）；
//项目行
var cellRight1=行插入单元格（1）；
var el1=document.createElement（'input'）；
初始初始推力（el1）；
el1.type='text'；
el1.value=''；
el1.name='t'+迭代+'u 1'；
el1.id='t'+迭代+'u 1'；
el1.1尺寸=13；
el1.onkeyup=计算值；
el1.onblur=计算值；
cellRight1.追加子女（el1）；
//价格行
var cellRight2=行插入单元格（2）；
var el2=document.createElement（'input'）；
前向推力（el2）；
el2.type='text'；
el2.value=''；
el2.name='t'+迭代+'u 2'；
el2.id='t'+迭代+'u 2'；
el2.2尺寸=10；
el2.onkeyup=计算值；
el2.onblur=Calc；
cellRight2.appendChild（el2）；
//价格行
var cellRight3=行插入单元格（3）；
var el3=document.createElement（'input'）；
初始初始推力（el3）；
el3.type='text'；
el3.value='0'；
el3.name='t'+迭代+'u 3'；
el3.id='t'+迭代+'u 3'；
el3.1尺寸=10；
cellRight3.appendChild（el3）；
}
函数removeRowFromTable（）
{
var tbl=document.getElementById（'tblSample'）；
var lastRow=tbl.rows.length；
如果（lastRow>3）tbl.deleteRow（lastRow-1）；
}
函数formReset（）
{
document.getElementById（“form2”）.reset（）；
}
函数计算（）{
var frm=document.form2；
如果（！frm.ary）{frm.ary=[frm.t1_1，frm.t1_2，frm.t1_3]；}
对于（var zxc0=0；zxc00&&！isNaN（frm.ary[zxc0].value））
{ 
总计=frm.ary[zxc0]。值*1*frm.ary[zxc0+1]。值；
}
frm.ary[zxc0+2]。值=总计；
}
var-sum1=0；
对于（var zxd0=0；zxd00&&！isNaN（frm.ary[zxd0+2].value））
{ 
sum1+=parseInt（frm.ary[zxd0+2].value）；
}
}
frm.sum.value=sum1；
}


1.
总数：
}

及

form1与前面提到的相同，包括用于日期时间选择器的jquery以及两个文本框…

u可以使用Java脚本

function button1click() {
  yourForm.action = "Final.php";
  yourForm.submit();
}

HTML中的n

<form action='' method='post'>
  ..
</form>

..

将表单2合并到表单1Nikhil中，只需删除：

，然后只提交

表单1

。或者您还有其他障碍吗？合并它们并对动态内容使用div..但是当我使用一个表单时，java脚本功能将变为非活动状态（用于动态行创建），然后使用用于生成第二个表和表单的代码更新您的问题。更新它以使其功能化（使用.appendChild、.insertBefore、.createElement等或通过jquery）当然很简单。这两个表单不能单独提交，.u可以以相同的方式添加其他表单及其JS函数。无论何时提交表格，都会将其张贴在该页面上