jQuery를 날짜 선택기 장애인 날짜 - 여러 범위 자바 스크립트/jQuery를의 n00b 그래서 나와 함께 곰

Question

메신저

내가 페이지 A를 가지고

STARTDATE & ENDDATE의 열이 여러 행이 들어있는 데이터베이스의 테이블을 가지고 datepicker jquery 요소

내가해야 할 일은 페이지로드에서 데이터베이스 테이블과 startdate의 모든 날짜를 사용 중지로 설정하는 것입니다. 다음은 개별 날짜를 처리하는 데 사용하는 방법이지만 알 수는 없습니다. 여러 항목을 반복하고 비활성화합니다 (r ANGES - 26-4-2017에 24-4-2017가 30-4-2017 17-5-2017에 사용할 수

그래서 여러 범위가

를 비활성화 할 필요도 비활성화 예를 들어

최신 날짜)에서

코드는 지금까지 아래가, 그냥 사용할 날짜 범위로 현재 렌더링되는 날을 비교 사람이 지금 2 일 동안이 이상 내 머리를 건 드리는 된 필자는 도움이 심한 코드 블록

 var disabledDays = ["22-04-2017"]; // M-DD-YYYY Format 

     /* utility functions */ 
     function nationalDays(date) { 
      var m = date.getMonth(), d = date.getDate(), y = date.getFullYear(); 
      //console.log('Checking (raw): ' + m + '-' + d + '-' + y); 
      for (i = 0; i < disabledDays.length; i++) { 
       if($.inArray((m+1) + '-' + d + '-' + y,disabledDays) != -1 || new Date() > date) { 
        //console.log('bad: ' + (m+1) + '-' + d + '-' + y + '/' + disabledDays[i]); 
        return [false]; 
       } 
      } 
      //console.log('good: ' + (m+1) + '-' + d + '-' + y); 
      return [true]; 
     } 

     /* 
     Above 2 are probably redundant because BaT are open Bank Holidays 
     and also open weekends so .. 
     */ 

     /* 
     Create DatePicker 
     Change MaxDate below to show more months 
     */ 
     jQuery(document).ready(function() { 
      jQuery('#date').datepicker({ 
       minDate: new Date(2017, 0, 1), 
       maxDate: new Date(2017, 6, 31), 
       dateFormat: 'DD, MM, d, yy', 
       constrainInput: true, 
       beforeShowDay: nationaldays 
      }); 
     }); 

Answer 1

을하시기 바랍니다.

$(document).ready(function() { 
 
    var startDisabledDates = new Date(2017, 03, 10), 
 
    endDisabledDates = new Date(2017, 03, 20); 
 

 
    $("#date").datepicker({ 
 
    beforeShowDay: function(day) { 
 
     var isSelectable = day < startDisabledDates || day > endDisabledDates; 
 
     return [isSelectable]; 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 
 

 
<input type="text" id="date">