버튼 누를때 input값 추가, for문으로 데이터 받기

많은 도움을 받은 소스 : http://www.webmadang.net/javascript/javascript.do?action=read&boardid=8001&page=4&seq=362

 

html

<form name="form" method="post" action="inviteUserAdd">
<table>
<tr>
<td colspan="2" align="left" bgcolor="#FFFFFF">
<table>
<tr>
<td colspan="5" bgcolor="#FFFFFF" height="25" align="left">
<input name="addButton" type="button" style="cursor:hand" onClick="insRow()" value="추가">
</tr>
<tr>
<td height="25">
<table id="addTable" bgcolor="#FFFFFF">
<tr>
<td><input type="text" name="addText[0]" ></td>
<td align="left"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table>
<tr>
<td height="10">
</td>
</tr>
<tr>
<td align="center">
<input type="submit" name="button" value="확인">
</td>
</tr>
</table>
</form>

 

html에서는 클릭 시 열을 추가

 

이름은 addText[0]부터 시작합니다.

 

 

 

script

 

var oTbl;
var i = 0;
var count = 1;
	
function insRow() {
	
i++;
count++;
	  
oTbl = document.getElementById("addTable");
var oRow = oTbl.insertRow();
oRow.onmouseover=function(){oTbl.clickedRowIndex=this.rowIndex};
	  
var oCell = oRow.insertCell();
var frmTag = "<input type='text' name='addText["+i+"]'>";

frmTag += "<input type=button value='삭제' onClick='removeRow()' style='cursor:hand'>";
frmTag += "<input type='hidden' name='count' value='"+count+"'>";
oCell.innerHTML = frmTag;
}

function removeRow() {
oTbl.deleteRow(oTbl.clickedRowIndex);
}
	

스크립트에서는 누르면 열 추가, 추가할 때 [] 안의 값이 증가한다.

 

count는 controller에서 for문 돌릴 때 최댓값을 확인하기 위해

 

 

controller

 

int count = Integer.parseInt(cc.getRequest().getParameter("count")==null?"1":cc.getRequest().getParameter("count"));
		
int i = 0;
		
for  ( i = 0; i < count; i++ ) {
			
String recipientId = cc.getRequest().getParameter("addText["+i+"]");

userDao.setInviteUser(recipientId);

};

 

먼저 count를 가져온다.

 

가져올때 값이 없으면 ( 왜냐하면 스크립트단 말고 html에서는 값이 없으니까. 버튼이 눌렸을 때에만 값이 생긴다. )

 

값이 없으면 1이 설정된다.

 

그리고 for문, int로 형 변환해준 count만큼 값이 증가한다.

 

 

---

 

 

이 코드가 분명 효율적인 코드인 것 같진 않다.

 

하지만 처음 요구사항을 받고 코드 분석을 하며 진행하였다.

 

조금 더 공부가 필요할 것 같다.

 

첨부터 설계를 잘 했다면

 

html에서 애초에 그려도 됐을 거고 list와 배열을 사용할 수 있었을 텐데..

 

아쉬움이 많다. 나중에 이 코드를 보고 엉망이네라고 말할 정도로 성장했으면 좋겠다.