Hi Mike,
Try this...this will format the second datepicker to only allow day selections 15 days in advance after the first is selected. This is on cloud with the classic designer.
*I used 16 days because when you select a day it's actually the day before at 19:00 GMT.
If you have an obedient user, they will click the first date picker then the second. However, if the user clicks the first date picker then the second date picker and they realize the didn't like the date on the first date picker and picks a new date, the second date picker doesn't 'reset'. I added a button for that to clear it and reset (just to test). It all depends on your use case and how critical it is to ensure the 15 days.
In the code below, q1/calendarDate is the first date picker, q2/myEndDate is the second date picker, q4 is a custom button to reset q2/myEndDate (the second date picker).
$(document).ready(function() {
$('#q4').on("click", function() {
$('#q2 input').val('');
$('.myEndDate input').datepicker("option", {
minDate: null,
maxDate: null
});
//alert( "Handler for `click` called." );
});
$('.calendarDate input').change(function() {
//required :: be sure to add the calendarDate class to the first date field
//required :: be sure to add the myEndDate class to the second date field
//optional :: you may want to consider disabling or hiding the second date field until
// the first date field is selected
//number of days in advance to set the second date picker
var daysInAdvance = 16
//grab the selected date from the first date field
var dt = new Date($(this).val());
//alert(dt);
//create a var for the new date and add days to it
var startDate = new Date();
startDate.setDate(dt.getDate() + daysInAdvance);
//set the minDate attr of the second date field(
var minDate = $.datepicker.formatDate('yy-mm-dd', new Date(startDate));
//alert(minDate);
$('.myEndDate input').attr('min', minDate);
})
});