JSFiddle - React, Tailwind, and code Playground
HTML
<div class="formInput">
<input type="text" id="beginDate" class="dpicker">
</div>
<div class="formInput">
<input type="id" id="endDate" class="dpicker">
</div>
JavaScript
$('body').on('focus', ".dpicker", function () {
$(this).datepicker();
});
$(function () {
$("#beginDate").datepicker({
minDate: 1,
changeMonth: true,
dateFormat: 'mm/dd/yy',
onClose: function (selectedDate, instance) {
if (selectedDate != '') {
$("#endDate").datepicker("option", "minDate", selectedDate);
var date = $.datepicker.parseDate(instance.settings.dateFormat, selectedDate, instance.settings);
date.setMonth(date.getMonth() + 3);
var minDate2 = new Date(selectedDate);
minDate2.setDate(minDate2.getDate() + 1);
$("#endDate").datepicker("option", "minDate", minDate2);
$("#endDate").datepicker("option", "maxDate", date);
}
}
});
$("#endDate").datepicker({
minDate: 1,
changeMonth: true,
dateFormat: 'mm/dd/yy',
onClose: function (selectedDate) {
$("#beginDate").datepicker("option", "maxDate", selectedDate);
}
});
});