JSFiddle - React, Tailwind, and code Playground
by Dedi Wibisono
HTML
<link rel="stylesheet" href="code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<input type="text" id="from_date">
<input type="text" id="to_date">
JavaScript
/* global setting */
var datepickersOpt = {
dateFormat: 'dd-mm-yy',
minDate : 0
}
$("#from_date").datepicker($.extend({
onSelect: function() {
var minDate = $(this).datepicker('getDate');
minDate.setDate(minDate.getDate()+2); //add two days
$("#to_date").datepicker( "option", "minDate", minDate);
}
},datepickersOpt));
$("#to_date").datepicker($.extend({
onSelect: function() {
var maxDate = $(this).datepicker('getDate');
maxDate.setDate(maxDate.getDate()-2);
$("#from_date").datepicker( "option", "maxDate", maxDate);
}
},datepickersOpt));