datepicker prevent choose day
//MUST ADD:
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.css" defer />
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"
integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="
crossorigin="anonymous"></script>
// php (cakephp)
<div class="col-sm-4 col-xs-12">
<?php echo $this->Form->input('delivery_date', array(
'class' => 'form-control', 'label' => false, 'placeholder' => __d('frontend', 'select_delivery_date'), 'required')); ?> </div>
</div>
// java script
function addDays(date, days) {
var result = new Date(date);
result.setDate(date.getDate() + days);
return result;
}
$('#InoviceDeliveryDate').datepicker({
orientation: 'bottom',
format: 'yyyy-mm-dd',
todayBtn: "linked",
autoclose: true,
todayHighlight: true,
maxViewMode: 0,
beforeShowDay: function(date) {
startDate = new Date();
endDate = addDays(startDate, 30); // extent 30 days more
start = startDate.getTime();
end = endDate.getTime();
current = date.getTime();
// prevent choose this date on calendar; 2021/02/12, 2021/02/13, 2021/02/14
special_dates = [];
special_dates.push(new Date('2021/02/12').getTime());
special_dates.push(new Date('2021/02/13').getTime());
special_dates.push(new Date('2021/02/14').getTime());
if (start <= current && current <= end) {
for (var i = 0; i < special_dates.length; i++) {
console.log(special_dates[i] + " " + current);
if (current === special_dates[i]) {
return [ false, "", "unAvailable" ];
}
}
return [ true, "", "Available" ];
} else {
return [ false, "", "unAvailable" ];
}
},
//language: 'custom',
}).on('changeDate', function(e) {
// `e` here contains the extra attributes
$('#InoviceDeliveryDate').datepicker('hide');
});