JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.js"></script>
<div id='diva1'></div>
<div id='diva2'></div>
<a id="a1">show a1</a>
<a id="a2">show a2</a>
<input id='boombada' type="text" size="23" value="" />
JavaScript
$("#a1,#a2").click(function(){
if (this.id === 'a1') {
$("#diva1").stop(true,true).slideDown();
$("#diva2").stop(true,true).slideUp();
}
else {
$("#diva2").stop(true,true).slideDown();
$("#diva1").stop(true,true).slideUp();
}
});
$("#diva1").datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy',
maxDate: "+5D",
mindate: "+0D",
onSelect: function(selectedDate) {
$("#diva2").datepicker("option", "minDate", selectedDate);
}
}).hide();
$("#diva2").datepicker({
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy',
maxDate: "+0D",
onSelect: function(selectedDate) {
$("#diva1").datepicker("option", "maxDate", selectedDate);
}
}).hide();