JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/flick/jquery-ui.css">
<div class="demo">
<p>Date: <input type="text" id="datepicker"></p>
<p>Date: <input type="text" id="datepicker2"></p>
</div>
JavaScript
var closedDates = [];
$('#datepicker').datepicker({
beforeShow: function() {
$(this).data('dateArray', [[11, 20, 2016], [11, 25, 2016]]);
$.extend(closedDates, $(this).data('dateArray'));
},
beforeShowDay: nonWorkingDates
});
$('#datepicker2').datepicker({
beforeShow: function() {
$(this).data('dateArray', [[11, 21, 2016], [11, 26, 2016]]);
$.extend(closedDates, $(this).data('dateArray'));
},
beforeShowDay: nonWorkingDates
});
function nonWorkingDates(date) {
var day = date.getDay();
console.log(closedDates);
for (i = 0; i < closedDates.length; i++) {
if (date.getMonth() == closedDates[i][0] - 1 && date.getDate() == closedDates[i][1] & date.getFullYear() == closedDates[i][2]) {
return [false];
}
}
return [true];
closedDates = [];
}