JSPダイナミック生成、追加フォームテーブル行-01をクリックします(追加をクリックするとACTIONにデータを提出します)
2225 ワード
<script language="javascript">
iIndex = 1;
var annex = 1;
var i=1;
function getIndex(){
iIndex = event.srcElement.parentElement.parentElement.rowIndex;
return iIndex;
}
function insertRow(iPos){
var otr=myTable.insertRow(annex);// tr
var ocell=otr.insertCell(0);// td
ocell.innerHTML="" + i + "";
var ocell=otr.insertCell(1);// td
ocell.innerHTML="<input type=text size=20 name=annexValue(" + i+ ") id=annexValue(" + i + ")>";
var ocell=otr.insertCell(2);// td
ocell.innerHTML="<input type=text size=20 name=annex(" + i + ") id=annexValue(" + i + ")>";
var ocell=otr.insertCell(3);// td
ocell.innerHTML="<td><input type=button onclick=deleteRow(getIndex()) value=' '></td>";
annex++;
document.getElementById("zjLength").value=annex;
i++;
}
function deleteRow(iPos){
document.all.myTable.deleteRow(iPos);
--annex;
document.getElementById("zjLength").value=annex;
}
</script>
<form name=myForm>
<a href="#" onClick="insertRow(0)"> </a>
<tr>
<td colspan="4" name=' '>
<input type="text" name="zjLength" id="zjLength" />
</td>
</tr>
<table id="myTable">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>
</form>