JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.5.0/css/bootstrap-datepicker.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<input id="openDatepick"></input>
JavaScript
var onlyThisDates = ['12/12/2018', '12/13/2018', '12/14/2018'];
$('#openDatepick').datepicker({
format: "mm/dd/yyyy",
startDate: "today",
autoclose: true,
beforeShowDay: function (date) {
var dt_ddmmyyyy = (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
if (onlyThisDates.indexOf(dt_ddmmyyyy) != -1) {
return {
tooltip: 'This date is enabled',
classes: 'active'
};
} else {
return false;
}
}
});