본문 바로가기
JavaScript/CSS

[jQuery] datepicker 특정일 선택 안되도록 설정

본문

 
토요일, 일요일은 선택이 안되도록 또는 특정일자는 선택이 안돼도록 설정할 수 있습니다.
아래 예제 소스에서 굵은 글자로 표시된 부분을 참조해주세요.
beforeShowDay 값에 해당 일자의 표시여부를 판단하는 함수를 적어주시면 됩니다.
각 상황별 함수는 그 아래에 첨부하였습니다.
 
HTML  파일
$('#input4').datepicker({
    showOn: 'button',
    buttonImage: '<?=$g4[path]?>/img/calendar.gif',
    buttonImageOnly: true,
    buttonText: "달력",
    changeMonth: true,
    changeYear: true,
    showButtonPanel: true,
    yearRange: 'c-99:c+99',
    minDate: '+1d',
    maxDate: '+100d',
    beforeShowDaynoSundays
});
 
상황별 함수
 
// 특정날짜들 배열 
var disabledDays = ["2013-7-9","2013-7-24","2013-7-26"];

// 주말(토, 일요일) 선택 막기 
function noWeekendsOrHolidays(date) { 
   var noWeekend = jQuery.datepicker.noWeekends(date); 
   return noWeekend[0] ? [true] : noWeekend; 
}
 
// 일요일만 선택 막기  
function noSundays(date) {  
 return [date.getDay() != 0, ''];  
 
// 이전 날짜들은 선택막기 
function noBefore(date){ 
   if (date < new Date()) 
       return [false]; 
   return [true]; 
}
// 특정일 선택막기 
function disableAllTheseDays(date) { 
   var m = date.getMonth(), d = date.getDate(), y = date.getFullYear(); 
   for (i = 0; i < disabledDays.length; i++) { 
       if($.inArray(y + '-' +(m+1) + '-' + d,disabledDays) != -1) { 
           return [false]; 
       } 
   } 
   return [true]; 
}
  • 트위터로 보내기
  • 페이스북으로 보내기
  • 구글플러스로 보내기

페이지 정보

최고관리자 작성일15-05-11 15:00 조회1,749회 댓글0건

댓글목록

등록된 댓글이 없습니다.

JavaScript/CSS 목록

게시물 검색

사이트 정보

  • 회사명 주인있소 / 대표 소담
  • 주소 강원도 속초시
  • 사업자 등록번호 123-45-67890
  • 전화 010-2026-0626 / 팩스 없음
  • 통신판매업신고번호 제 OO구 - 123호
  • 개인정보관리책임자 정보책임자명

고객센터

상단으로