JSPダイナミック生成、追加フォームテーブル行-01をクリックします(追加をクリックするとACTIONにデータを提出します)


<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>