JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/dot-luv/jquery-ui.css">
<input type="text" id="startDate" /><br>
<input type="text" id="endDate" />
JavaScript
$(document).ready(function () {
$('#endDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true, onSelect: function () { },
onClose: function () { $(this).focus(); }
});
$('#startDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true,
minDate:'-6m',
onSelect: function (dateText, inst) {
var nyd = new Date(dateText);
nyd.setFullYear(nyd.getFullYear()+1);
$('#endDate').datepicker("option", { minDate: new Date(dateText), maxDate: nyd });
},
onClose: function () { $(this).focus(); }
});
});