I am using jQuery UI datepicker for my calendar. I have used the beforeShowDay function to block out days which are unavailable. This data comes from an AJAX call which when successful I then populate the calendar.
This works well, however I then want to update the datepicker each time dates become unavailable but I cannot get the datepicker to refresh. I want to be able to call a function e.g. getdates(0);
and the datepicker gets updated.
See function code below:
function getdates(duration) {
$.getJSON(pluginUrl+"ajax/getdates.php?duration="+duration, function( data ) {
if(data['success'] == 1){
console.log("here");
var nonWorking = data['non_working_days'];
var nonWorkingDates = data['non_working_dates'];
var fullyBookedDates = data['fully_booked_dates'];
jQuery("#datepicker").datepicker({
minDate: 0,
maxDate: "+2m",
beforeShowDay: function(date){
var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
var day = date.getDay();
var status = true;
if(nonWorking.indexOf(day) >= 0){
var status = false;
}
if(nonWorkingDates.indexOf(string) >= 0){
var status = false;
}
if(fullyBookedDates.indexOf(string) >= 0){
var status = false;
}
console.log('in here');
return [ status ];
}
});
}
});
}
Example of the UI:
Thanks for any help