Set changeMonth and changeYear to true so that Month and Year appear as Dropdown. Set date format to "MM yy". jQuery DatePicker has "onClose" event, which is called when Datepicker gets closed. So using this event, fetch the selected Month and Year and setDate of Datepicker.
As you can see in the above code, we have provided ' format:"yyyy" ' (ex: 2022) and " viewMode:'years '", which will allow datepicker to show/select only year part and it will hide Months or date part, plus we have made 'autoclose:true', which will close datepicker as soon as we select year.
How about this :
$("#datepicker").datepicker( {
format: "mm-yyyy",
viewMode: "months",
minViewMode: "months"
});
Reference : Datepicker for Bootstrap
For version 1.2.0 and newer, viewMode
has changed to startView
, so use:
$("#datepicker").datepicker( {
format: "mm-yyyy",
startView: "months",
minViewMode: "months"
});
Also see the documentation.
Notice that in the version of 1.2.0 the viewMode
has changed to startView
.
eg:
$('#sandbox-container input').datepicker({
startView: 1,
minViewMode: 1
});
http://eternicode.github.io/bootstrap-datepicker/?markup=component&format=yyyy&weekStart=&startDate=&endDate=&startView=2&minViewMode=2&todayBtn=false&language=zh-CN&orientation=auto&autoclose=on&forceParse=on#sandbox
I'm using version 2(supports both bootstrap v2 and v3) and for me this works:
$("#datepicker").datepicker( {
format: "mm/yyyy",
startView: "year",
minView: "year"
});
For the latest bootstrap-datepicker
(1.4.0 at the time of writing), you need to use this:
$('#myDatepicker').datepicker({
format: "mm/yyyy",
startView: "year",
minViewMode: "months"
})
Source: Bootstrap Datepicker Options
I am using bootstrap calender for future date not allow with allow change in months & year only..
var j = jQuery.noConflict();
j(function () {
j(".datepicker").datepicker({ dateFormat: "dd-M-yy" }).val()
});
j(function () {
j(".Futuredatenotallowed").datepicker({
changeMonth: true,
maxDate: 0,
changeYear: true,
dateFormat: 'dd-M-yy',
language: "tr"
}).on('changeDate', function (ev) {
$(this).blur();
$(this).datepicker('hide');
}).val()
});
You should have to add only minViewMode: "months"
in your datepicker function.
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