본문 바로가기

web/JSP

jsp text box 동적 추가 삭제 파라미터로 넘기기!

사실 복수개의 파일 업로드를 찾다가 우연히 찾아서 대충해봣는데...되네..ㅡ,.ㅡ; 신기;;ㅋ
1. 추가를 5개 하고 이름을 넣었음


2. 삭제를 하고 전송을 눌러주면


3. 넘어온 파라미터들을 뿌리게 된다.





 index.jsp 파일

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
    
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE> </TITLE>
</HEAD>
<script language="javascript">
 var count = 1;
 var addCount;
 
//행추가
function addInputBox() {
 for(var i=1; i<=count; i++) {
  if(!document.getElementsByName("test"+i)[0]) {
   addCount = i;
   break;
  }
  else addCount = count;
 }
 var addStr = "<tr><td width=40><input type=checkbox name=checkList value="+addCount+" size=40 ></td><td width=140><input type=text  value ="+addCount+" name=test"+addCount+" size=40></td></tr>";
 var table = document.getElementById("dynamic_table");
 var newRow = table.insertRow();
 var newCell = newRow.insertCell();
 newCell.innerHTML = addStr;
 count++;
}
 
//행삭제
function subtractInputBox() {
 var table = document.getElementById("dynamic_table");
 //var max = document.gForm.checkList.length;
 //alert(max);
 var rows = dynamic_table.rows.length;
 var chk = 0;
 if(rows > 1){
  for (var i=0; i<document.gForm.checkList.length; i++) {
   if (document.gForm.checkList[i].checked == true) {
    table.deleteRow(i);
    i--;
    count--;
    chk++;
   }
  }
  if(chk <= 0){
   alert("삭제할 행을 체크해 주세요.");
  }
   }else{
    alert("더이상 삭제할 수 없습니다.");
   }
}
 
function submitbutton() {
// gForm.count.value = count;
 var gform = document.gForm;
 gform.count.value = count;
 alert(count);
 gForm.submit();
 return;
}
</script>

<BODY -nLoad="addInputBox()">
<input type="button" value="행 추가" onclick="javascript:addInputBox();"> : <input type="button" value="행 삭제" onclick="javascript:subtractInputBox();"><br><br>
<input type="button" value="전송" onclick="javascript:submitbutton();">
<form name="gForm" action="./alert.jsp" method="get">
  <input type="hidden" name="count">
<table  cellpadding=0 cellspacing=0 id="" border="1">
<tr>
 <td width="40">체크</td>
 <td width="160">내용</td>
</tr>
<tr>
<table cellpadding=0 cellspacing=0 id="dynamic_table" border="1">
</table>
</tr>
</table>
</form>

</BODY>
</HTML>

- 다른곳은 필요없고 스크립트만 잘 보시면 됩니다. 사실 submit 부분에서 카운트를 넘길려고 하는것에서 많이 막혔엇음. 스크립트에서 어떻게 파라미터를 보내는지를 몰라서;ㅎ


alert.jsp
<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
    
    <%
     int count = Integer.parseInt(request.getParameter("count"));
    
    
    %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
</head>
<body>

<%

for(int i = 1; i<=count; i++){
   String str = "test"+i;
   if(request.getParameter(str) != null){%>
   <%=request.getParameter(str) %><br>
   <%} 
   
}
%>
</body>
</html>






- alert 는 간단하게 받아온 카운터 파라미터로 for문을 돌려서 받아온 파라미터를 뿌려주는 역활을 한다. 
- 삭제시 넘어가는 파라미터의 이름은 카운터로 증가해서 for문을 카운트순서대로 돌리면 에러가 난다.
파라미터가 null이면 그냥 넘어가게 만들면 에러가 나지 않는다.




'web > JSP' 카테고리의 다른 글

jsp 파일 다운 로드  (0) 2010.11.12
jsp 다중 파일업로드  (4) 2010.11.11
jsp cos.jar 기초 파일 업로드  (4) 2010.11.09
JSP java.lang.NullPointerException  (0) 2010.11.08
JSP Statement PreparedStatement  (0) 2010.11.03