I have the two following datepicker objects but I can't get what I want as I am getting stuck with the minDate and maxDate options:
This is to restrict the dates to future dates.
What I want: restrict the dates from current date to 30 years time.
What I get: restrict the dates from current date to 10 years time.
$(".datepickerFuture").datepicker({
showOn: "button",
buttonImage: 'calendar.gif',
buttonText: 'Click to select a date',
duration:"fast",
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy',
constrainInput: true,
minDate: 0,
maxDate: '+30Y',
buttonImageOnly: true
});
This is to restrict to select only past dates:
What I want: restrict the dates from current date to 120 years ago time.
What I get: restrict the dates from current date to 120 years ago time, but when I select a year the maximum year will reset to selected year (e.g. what I would get when page load from fresh is 1890-2010, but if I select 2000 the year select box reset to 1880-2000) .
$(".datepickerPast").datepicker({
showOn: "button",
buttonImage: 'calendar.gif',
buttonText: 'Click to select a date',
duration:"fast",
changeMonth: true,
changeYear: true,
dateFormat: 'dd/mm/yy',
constrainInput: true,
yearRange: '-120:0',
maxDate: 0,
buttonImageOnly: true
});
I need help with both datepicker object, any help would be very much appreciated.
If you like to restrict access of users to select a date within a range then there is minDate and maxDate options are available in jQuery UI. Using this you can set the date range of the Datepicker. After defining these options the other days will be disabled which are not in a defined range.
To set it after init, use $('#datepicker'). datepicker( "option", "minDate", new Date( 1999, 10 - 1, 25 ) ) .
inside the jQuery script code just paste the code. $( ". selector" ). datepicker({ dateFormat: 'yy-mm-dd' });
JavaScript Code: $( function() { var from = $( "#fromDate" ) . datepicker({ dateFormat: "yy-mm-dd", changeMonth: true }) . on( "change", function() { to. datepicker( "option", "minDate", getDate( this ) ); }), to = $( "#toDate" ).
$("#datepick").datepicker({
changeMonth: true,
changeYear: true,
showOn: 'button',
buttonImage: 'images/calendar.gif',
buttonImageOnly: true,
dateFormat: 'dd/mm/yy',
minDate: '-100Y',
maxDate: '-1Y',
yearRange: '-100',
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With