Demo with event start and end date selection in calendar with Maximum duration limit using JQuery

HTML

 <div class="col-md-2">Date: Start Date <br> <input type="text" id="date_picker1" size=9></div>
<div class="col-md-2">Date: End Date <br> <input type="text" id="date_picker2" size=9></div>

JQuery

<script>
$(document).ready(function() {
///////
var startDate;
var endDate;
 $( "#date_picker1" ).datepicker({
dateFormat: 'dd-mm-yy'
})
///////
///////
 $( "#date_picker2" ).datepicker({
dateFormat: 'dd-mm-yy'
});
///////
$('#date_picker1').change(function() {
endDate = $(this).datepicker('getDate');
endDate.setDate(endDate.getDate() + 15); 
$("#date_picker2").datepicker("option", "maxDate", endDate  );
$("#date_picker2").datepicker("option", "minDate", $(this).datepicker('getDate')  );
})

///////
$('#date_picker2').change(function() {
startDate = $(this).datepicker('getDate');
startDate.setDate(startDate.getDate() - 15); 
$("#date_picker1").datepicker("option", "minDate", startDate  );
$("#date_picker1").datepicker("option", "maxDate", $(this).datepicker('getDate')  );
})
////////////////
})
</script>