Ad

Can Not Figure Out Why Dates Are Not Restricted

- 1 answer

This is my code from Shopify. I am trying to restrict holidays. The weekends are blocked out fine. Can someone please tell me why my unavailable dates does not work? I am trying to restrict holidays.

var currentDate = new Date();
var n = currentDate.getHours();
var m = +2;

if (n < 14){
m = 4;
} else {
m = 5;
}


$(document).ready( function() {
      $(function() {
        $("#date").datepicker( {
          minDate: m,
          maxDate: '+2M',
          beforeShowDay: jQuery.datepicker.noWeekends
        } );
      });
    });


var days = ["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday","Sunday"];
var unavailableDates = ["2017/11/23","2017/11/24","2017/12/25","2017/12/26","2018/01/01"]; // yyyy/MM/dd
var unavailableDays = ["Saturday","Sunday"];


function unavailable(date) {
    ymd = date.getFullYear() + "/" + ("0"+(date.getMonth()+1)).slice(-2) + "/" + ("0"+date.getDate()).slice(-2);
    day = new Date(ymd).getDay();
    if ($.inArray(ymd, unavailableDates) < 0 && $.inArray(days[day], unavailableDays) < 0) {
        return [true, "enabled", "Book Now"];
    } else {
        return [false,"disabled","Booked Out"];
    }
}
Ad

Answer

This should do it:

var currentDate = new Date();
var n = currentDate.getHours();
var m = +2;

if (n < 14) {
  m = 4;
} else {
  m = 5;
}

var unavailableDates = ["2017/11/23", "2017/11/24", "2017/12/25", "2017/12/26", "2018/01/01"]; // yyyy/MM/dd

$(document).ready(function() {
  $(function() {
    $("#date").datepicker({
      minDate: m,
      maxDate: '+2M',
      beforeShowDay: function(date) {
        var noWeekend = $.datepicker.noWeekends(date);
        var datestring = jQuery.datepicker.formatDate('yy/mm/dd', date);
        if (noWeekend[0]) {
          return [unavailableDates.indexOf(datestring) == -1];
        } else return noWeekend;
      }
    });
  });
});
<link rel="stylesheet" target="_blank" rel="nofollow noreferrer" target="_blank" rel="nofollow noreferrer" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<p>Date: <input type="text" id="date"></p>

Ad
source: stackoverflow.com
Ad