1つの宛先ページに送信する2つのフォームがあります。
<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();">
ここ 、
form1にはいくつかのサティックな内容があります
と
form2にはjsによって動的に生成されるテーブルがあります...問題は...両方のフォームから同じページに値を送信したいfinal.php...どのようにそれを行うか.....plsは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();">
}
と
form1は、datetimepickersのjqueryといくつかのテキストボックスを含めて、前述したものと同じです。