I have the following script for my datepicker:
<script>
$(document).ready(function(){
var date_input=$('input[name="Date"]'); //date input has the name "Date"
date_input.datepicker({
format: 'yyyy-mm-dd',
todayHighlight: true,
autoclose: true,
});
});
</script>
which is working properly.
However, when I try to set some additional options, those changes do not appear implemented in the calendar.
For instance, adding the following line after autoclose: true will not show two months
numberOfMonths: 2
Or adding the following two lines will not limit the dates that can be selected:
minDate: new Date(2016, 12 - 1, 16),
maxDate: new Date(2017, 1 - 1, 7)
That means, the following script behaves exactly the same as the one at the beginning of the question:
<script>
$(document).ready(function(){
var date_input=$('input[name="Date"]'); //date input has the name "Date"
date_input.datepicker({
format: 'yyyy-mm-dd',
todayHighlight: true,
autoclose: true,
numberOfMonths: 2,
minDate: new Date(2016, 12 - 1, 16),
maxDate: new Date(2017, 1 - 1, 7)
});
});
</script>
I thought that maybe I have the same script somewhere else duplicated, but it does not seem to be the case, since if I change the format from format: 'yyyy-mm-dd' to format: 'yyyy/mm/dd', this change is actually visible.
Why then am I not able to set some additional properties in my datepicker?
It seems all the codes are working fine. Check this code and compare with yours, may be you have called datepicker() function more than once for that name field. Check your js and html file both. If you call more than once it won't show the result properly. But basic date picker works for the first call, that's why rest of the functionality doesn't work.
Click here to see the pen from codepen