입력받은 숫자대로 다른 입력폼을 만들 수 있나요?
본문
첨부한 이미지는
참가인원을 받는 폼입니다.
위쪽에서 참가인원을 받은 수대로 자동으로 아래 명단 폼이 그 숫자대로
예를들어 참가인원에 15라고 쓰면
명단이 15칸이 자동으로 나오게 하는게 가능한가요?
가능하면 어떻게 해야 하나요?
php와 자바스크립트로 아무리 해봐도 답이 없네요
답변 2
참가인원 : <input type="text" name="qty" id="qty">
<br>
참가자명단
<table id="test">
<thead>
<tr>
<td>번호</td>
<td>이름</td>
<td>생년월일</td>
<td>연락처</td>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
<script>
$("#qty").keyup(function(){
var len = $(this).val().replace('/[^0-9]/g', "");
if(len > 0){
var str;
for(i=1; i<=len; i++){
str += '<tr>';
str += '<td>'+i+'</td>';
str += '<td><input name="name[]"></td>';
str += '<td><input name="birth[]"></td>';
str += '<td><input name="tel[]"></td>';
str += '</tr>';
}
$("#test tbody").html(str);
}
})
</script>
https://velog.io/@dpdnjs402/txh3sqqj
https://recoderr.tistory.com/54
구글에서 "javascript 테이블 행 동적생성" 검색 하시면
다양한 예제가 나옵니다.
하지만, 말씀하신 숫자를 입력시 그 숫자만큼 나오는 예제는 찾아보니 없는듯합니다.
위 예제들과 같이 버튼을 클릭했을때에, 생성되는 부분을 참고하셔
input의 숫자가 입력될시 자바스크립트로 체크하여, 동적추가 로직을 만들면 될듯합니다.
해당 부분은 간단하게 테이블 행만 만든다고 되는부분은 아니라
뒤에 저장을 하는 php파일에서도
해당 배열들에 대한 저장을 해야하니, 이 부분 고려하시기바랍니다.
답변을 작성하시기 전에 로그인 해주세요.