자바스크립트 질문입니다 채택완료
dlsdo04
9년 전
조회 3,582
제가 동적필드를 생성하고 삭제하는 추가/삭제 버튼을 만들었는데 추가를 누르면 행이 잘 추가 되는데, 삭제버튼은 자바스크립트 코드가 적용이 안되어서요 .. !
var row = table.rows[i]; 여기 까지는 잘 나오는것 같은데
var chkbox = row.cells[0].childNodes[0]; -> 여기서부터 조금 이상한것 같아서요.. !
뭐가 문제 있는지 봐주실 수 있나요?
</p><p style="margin-left: 40px;"><span class="Apple-tab-span" style="white-space:pre"> </span><p id="adRow"> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span> <input type="button" value="추가" onClick="addRow('dataTable')" class="button"/> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span> <input type="button" value="삭제" onClick="deleteRow('dataTable')" class="button"/> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><table id="dataTable" class="dataTable" border="1"></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><tbody></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><tr><p></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><td></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><input type="checkbox" name="chk[]" checked="checked" /></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></td></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><td></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label>과일</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><select name="sub1[]" required></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="">선택하세요</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="1">사과</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="2">수박</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></select></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></div></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></td></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><td></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><label>과정</label></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><select name="sub5[]" required></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="">선택하세요</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="표준">표준과정</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span><option value="응용">응용과정</option></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></select></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></td><span class="Apple-tab-span" style="font-size: 11pt; white-space: pre;"> </span></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></p></tr></p><p><span class="Apple-tab-span" style="white-space:pre"> </span> </tbody></p><p><span class="Apple-tab-span" style="white-space:pre"> </span></table></p><p> </p><p> </p><p><script></p><p>function addRow(tableID) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var table = document.getElementById(tableID);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var rowCount = table.rows.length;</p><p> </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var row = table.insertRow(rowCount);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var colCount = table.rows[0].cells.length;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>for(var i=0; i <colCount; i++) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var newcell = row.insertCell(i);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>newcell.innerHTML = table.rows[0].cells[i].innerHTML;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p>}</p><p> </p><p>function deleteRow(tableID) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var table = document.getElementById(tableID);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var rowCount = table.rows.length;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>for(var i=0; i<rowCount; i++) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var row = table.rows[i];</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>var chkbox = row.cells[0].childNodes[0];</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(null != chkbox && true == chkbox.checked) {</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>if(rowCount <= 1) { // limit the user from removing all the fields</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>alert("Cannot Remove all the Passenger.");</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>break;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>table.deleteRow(i);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>rowCount--;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>i--;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p>}</p><p></script></p><p>
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
9년 전
deleteRow() 메소드 안에
var chkbox = row.cells[0].childNodes[0];
-->
var chkbox = row.cells[0].childNodes[1];
근데 어지간하면 deleteRow() 메소드명은 다른 걸로 하시는 게 낫지 않을까 싶네요.
아무래도 이름이 중복이고 table.deleteRow(i); 이러니까 재귀 호출인 줄...
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
d
dlsdo04
9년 전
우와!!! 되었습니다 ! 감사드려요!!!ㅎㅎㅎㅎ
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인