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();
저는 이렇게 사용합니다.