테스트 사이트 - 개발 중인 베타 버전입니다

입력받은 숫자대로 다른 입력폼을 만들 수 있나요? 채택완료

smltree 3년 전 조회 1,924

첨부한 이미지는 참가인원을 받는 폼입니다. 위쪽에서 참가인원을 받은 수대로 자동으로 아래 명단 폼이 그 숫자대로 예를들어 참가인원에 15라고 쓰면 명단이 15칸이 자동으로 나오게 하는게 가능한가요? 가능하면 어떻게 해야 하나요? php와 자바스크립트로 아무리 해봐도 답이 없네요

 

댓글을 작성하려면 로그인이 필요합니다.

답변 2개

채택된 답변
+20 포인트
m
3년 전

</p>

<p>

참가인원  : <input type="text" name="qty" id="qty">




참가자명단

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

        }

    })</p>

<p></script></p>

<p>

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

그누위즈

https://velog.io/@dpdnjs402/txh3sqqj

https://recoderr.tistory.com/54

 

구글에서 "javascript 테이블 행 동적생성" 검색 하시면

다양한 예제가 나옵니다.

하지만, 말씀하신 숫자를 입력시 그 숫자만큼 나오는 예제는 찾아보니 없는듯합니다.

위 예제들과 같이 버튼을 클릭했을때에, 생성되는 부분을 참고하셔

input의 숫자가 입력될시 자바스크립트로 체크하여, 동적추가 로직을 만들면 될듯합니다.

해당 부분은 간단하게 테이블 행만 만든다고 되는부분은 아니라

뒤에 저장을 하는 php파일에서도

해당 배열들에 대한 저장을 해야하니, 이 부분 고려하시기바랍니다.

로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인