I have a jquery datepicker script and what I want to do is to change “minDate: 10” value by a select box.
if the first option is selected the minDate:10 , if the second option is selected then minDate:20 etc…
Is it going to update the datepicker in real time every time I select a different selection?
Thanks in advance!
$(function() {
$('#hotel').change(function() {
// assign the value to a variable, so you can test to see if it is working
var selectVal = $('#hotel :selected').val();
if( selectVal == "hotel_c" ) {
var date = 10;
}
if( selectVal == "hotel_a" ) {
var date = 15;
}
if( selectVal == "hotel_b" ) {
var date = 6;
}
});
var dates = $('#from, #to').datepicker({
defaultDate: "+1w",
changeMonth: true,
dateFormat: 'yy-m-d',
minDate: 10,
numberOfMonths: 3,
onSelect: function(selectedDate) {
var option = this.id == "from" ? "minDate" : "maxDate";
var instance = $(this).data("datepicker");
var date = $.datepicker.parseDate(instance.settings.dateFormat || $.datepicker._defaults.dateFormat, selectedDate, instance.settings);
dates.not(this).datepicker("option", option, date);
}
});
});
You can write your change handler like this:
This has 2 changes, we’re calling the
.datepicker('option', 'minDate', val)method, and we’re using an object to map the date ranges to clean it up a bit. This will only let you select a date 15, 6, or 10 days out depending on your selection.You can see this with the rest of your code working here