Changing minDate and maxDate on the fly using jQuery DatePicker
You have a couple of options...
1) You need to call the destroy()
method not remove()
so...
$('#date').datepicker('destroy');
Then call your method to recreate the datepicker
object.
2) You can update the property of the existing object
via
$('#date').datepicker('option', 'minDate', new Date(startDate));
$('#date').datepicker('option', 'maxDate', new Date(endDate));
or...
$('#date').datepicker('option', { minDate: new Date(startDate),
maxDate: new Date(endDate) });
For from / to date, here is how I implemented restricting the dates based on the date entered in the other datepicker. Works pretty good:
function activateDatePickers() {
$("#aDateFrom").datepicker({
onClose: function() {
$("#aDateTo").datepicker(
"change",
{ minDate: new Date($('#aDateFrom').val()) }
);
}
});
$("#aDateTo").datepicker({
onClose: function() {
$("#aDateFrom").datepicker(
"change",
{ maxDate: new Date($('#aDateTo').val()) }
);
}
});
}
$(document).ready(function() {
$("#aDateFrom").datepicker({
onSelect: function() {
//- get date from another datepicker without language dependencies
var minDate = $('#aDateFrom').datepicker('getDate');
$("#aDateTo").datepicker("change", { minDate: minDate });
}
});
$("#aDateTo").datepicker({
onSelect: function() {
//- get date from another datepicker without language dependencies
var maxDate = $('#aDateTo').datepicker('getDate');
$("#aDateFrom").datepicker("change", { maxDate: maxDate });
}
});
});