datepicker 여러개 사용하기 질문드립니다.

datepicker 여러개 사용하기 질문드립니다.

QA

datepicker 여러개 사용하기 질문드립니다.

본문

안녕하세요

 

datepicker를 여러개 사용하고 싶습니다. 한 10개정도..

처음에 한개는 잘 나오는데 나머지가 안나옵니다. 

구글링해도 딱히 원하는 답이 안나와서요 ㅠ

 

<input type="text" id="datepicker" name="wr_1" class="date" placeholder="날짜 선택1">

<input type="text" id="datepicker" name="wr_2" class="date" placeholder="날짜 선택2">

<input type="text" id="datepicker" name="wr_3" class="date" placeholder="날짜 선택3">

.

.

 

<script>
    $.datepicker.setDefaults({
        dateFormat: 'yy-mm-dd',
        prevText: '이전 달',
        nextText: '다음 달',
        monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        dayNames: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
        showMonthAfterYear: true,
        yearSuffix: '년',
        beforeShowDay: noSundays
    });
     function noSundays(date) {
       return [date.getDay() != 0, ''];
     }
    $(function() {
        $("#datepicker").datepicker();
    });
</script>

 

고수님들의 도움 부탁드립니다. ㅠ

이 질문에 댓글 쓰기 :

답변 5

<input type="text" id="datepicker" name="wr_1" class="date datepicker" placeholder="날짜 선택1">

<input type="text" id="datepicker" name="wr_2" class="date datepicker" placeholder="날짜 선택2">

<input type="text" id="datepicker" name="wr_3" class="date datepicker" placeholder="날짜 선택3">

.

.

 

<script>
    $.datepicker.setDefaults({
        dateFormat: 'yy-mm-dd',
        prevText: '이전 달',
        nextText: '다음 달',
        monthNames: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        monthNamesShort: ['1월', '2월', '3월', '4월', '5월', '6월', '7월', '8월', '9월', '10월', '11월', '12월'],
        dayNames: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesShort: ['일', '월', '화', '수', '목', '금', '토'],
        dayNamesMin: ['일', '월', '화', '수', '목', '금', '토'],
        showMonthAfterYear: true,
        yearSuffix: '년',
        beforeShowDay: noSundays
    });
     function noSundays(date) {
       return [date.getDay() != 0, ''];
     }
    $(function() {
        $(".datepicker").datepicker();
    });
</script>

$("#datepicker").datepicker();

이부분을 클래스로 선언해서 처리하셔도 됩니다. 

현재 위 input들이 모두 date라는 class를 가지고 있으니 

$(".date").datepicker();

이렇게 하시면 한번에 다 datepicker가 적용됩니다. 

<input type="text" id="datepicker1" name="wr_1" class="date" placeholder="날짜 선택1">

<input type="text" id="datepicker2" name="wr_2" class="date" placeholder="날짜 선택2">

<input type="text" id="datepicker3" name="wr_3" class="date" placeholder="날짜 선택3">

 

$("#datepicker1, #datepicker2, #datepicker3").datepicker();

 

저는 이렇게 사용합니다.

답변을 작성하시기 전에 로그인 해주세요.
전체 52,840
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIR SOFT