2013-09-24 2 views
2

고객이 원하는 배달 날짜를 선택할 수 있도록 내 웹 사이트에서 Jquery datepicker를 사용하고 있습니다. 현재 주말이나 공휴일을 제외한 4 일의 최소 날짜를 설정했습니다. 나는 누군가가 오후 2시 이후에 주문을하면, 그것이 너무 늦을 것 같아서 minDate에 그 날을 세지 않을 수 있도록 하루 시간을 고려해야한다는 것을 깨달았다. jQuery Datepicker 시간을 계산하는 최소 날짜

나는 그것에 대해 몇 가지 게시물을 찾을 수 있었다 특히 하나의 적용 듯 :

How do I restrict dates on datepicker after a certain time

그러나, 나는 심각하게 힘든 시간을 내 현재 스크립트 (아래)이 적용하는 데 문제가 있습니다. 누군가가 나에게 이걸 어떻게 맞출 지 말해 줄 수 있다면 완전히 냉정 할 것입니다.

시간을내어 도와 주셔서 감사합니다. ~ 수잔

<script type="text/javascript"> 
    $(document).ready(function() { 

    //holidays 
    var natDays = [ 
    [1, 1, 'uk'], 
    [12, 25, 'uk'], 
    [12, 26, 'uk'] 
    ]; 

    var dateMin = new Date(); 
    var weekDays = AddBusinessDays(4); 

    dateMin.setDate(dateMin.getDate() + weekDays); 

    function AddBusinessDays(weekDaysToAdd) { 
    var curdate = new Date(); 
    var realDaysToAdd = 0; 
    while (weekDaysToAdd > 0){ 
     curdate.setDate(curdate.getDate()+1); 
     realDaysToAdd++; 
     //check if current day is business day 
     if (noWeekendsOrHolidays(curdate)[0]) { 
     weekDaysToAdd--; 
     } 
    } 
    return realDaysToAdd; 

    } 

    function noWeekendsOrHolidays(date) { 
     var noWeekend = $.datepicker.noWeekends(date); 
     if (noWeekend[0]) { 
      return nationalDays(date); 
     } else { 
      return noWeekend; 
     } 
    } 
    function nationalDays(date) { 
     for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 
       return [false, natDays[i][2] + '_day']; 
      } 
     } 
     return [true, '']; 
    } 
    $('#datepicker').datepicker({ 
     inline: true, 
     beforeShowDay: noWeekendsOrHolidays,   
     showOn: "both",    
     firstDay: 0, 
     dateformat: "dd/mm/yy", 
     changeFirstDay: false, 
     showButtonPanel: true,  
     minDate: dateMin    
    }); 
}); 
</script> 

<p> 
<label for="datepicker">Desired Delivery Date: </label> 
    <input class="input-medium" type="text" id="datepicker" placeholder="ex. 01/01/2013" name="properties[Delivery Date]" readonly /> 
    <label><font size=1>Need it faster? Please call us! (800) 880-0307</font> 
    </label></p> 
<style> 
    #datepicker { height: 20px; } 
    #datepicker {-webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;} 
</style> 

답변

1

나는 결국이 문제를 해결하여 내 자신의 질문에 대한 답변을 게시하고 있습니다. 누군가가 도움이되기를 바랍니다. 다음은 미국 국경일 및 주말을 제외한 4 일의 최소 날짜 및 오후 2시 이후 인 경우 오늘 날짜를 제외하는 최소 날짜 조정을 포함한 전체 코드입니다.

<script type="text/javascript"> 
    $(document).ready(function() { 

    //holidays 
    var natDays = [ 
     [1, 1, 'New Year'], //2014 
     [1, 20, 'Martin Luther King'], //2014 
     [2, 17, 'Washingtons Birthday'], //2014  
     [5, 26, 'Memorial Day'], //2014 
     [7, 4, 'Independence Day'], //2014 
     [9, 1, 'Labour Day'], //2014 
     [10, 14, 'Columbus Day'], //2013 
     [11, 11, 'Veterans Day'], //2013 
     [11, 28, 'Thanks Giving Day'], //2013 
     [12, 25, 'Christmas'] //2013  
]; 

    var dateMin = new Date(); 
    dateMin.setDate(dateMin.getDate() + (dateMin.getHours() >= 14 ? 1 : 0)); 
    AddBusinessDays(dateMin, 4); 

    function AddBusinessDays(curdate, weekDaysToAdd) { 
     while (weekDaysToAdd > 0) { 
      curdate.setDate(curdate.getDate() + 1); 
      //check if current day is business day 
      if (noWeekendsOrHolidays(curdate)[0]) { 
       weekDaysToAdd--; 
      } 
     } 
    }  

    function noWeekendsOrHolidays(date) { 
     var noWeekend = $.datepicker.noWeekends(date); 
     if (noWeekend[0]) { 
      return nationalDays(date); 
     } else { 
      return noWeekend; 
     } 
    } 
    function nationalDays(date) { 
     for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == natDays[i][1]) { 
       return [false, natDays[i][2] + '_day']; 
      } 
     } 
     return [true, '']; 
    } 
     $('#datepicker').datepicker({ 
      inline: true, 
      beforeShowDay: noWeekendsOrHolidays,   
      showOn: "both",    
      firstDay: 0, 
      dateformat: "dd/mm/yy", 
      changeFirstDay: false, 
      showButtonPanel: true,  
      minDate: dateMin    
    }); 
    }); 
    </script> 

<p> 
<label for="datepicker">Desired Delivery Date: </label> 
    <input class="input-medium" type="text" id="datepicker" placeholder="ex. 01/01/2013" name="properties[Delivery Date]" readonly /> 
    <label><font size=1>Need it faster? Please call us! (800) 880-0307</font> 
    </label></p> 
<style> 
    #datepicker { height: 20px; } 
    #datepicker {-webkit-border-radius: 0 3px 3px 0; -moz-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0;} 
</style> 
관련 문제