In am using a calendar in bootsrtap datepicker, in that I have displaying only month and year (mm-yyy). I want to disable future months from current month. I have searched a lot but I didn't find an answer. Please help me, I have attached my code below

JS :

$(document).ready(function () {

        var cou = $('#rolecount').val();
        var c;

        for (c = 0; c <=cou; c++){
            $('#datepicker'+c).datepicker({
            format: 'mm-yyyy',
            endDate: '+0d',
            viewMode: "months", 
            minViewMode: "months",
            });  

        $('#datepicker'+c).datepicker().on('monthSelected', function(ev){
            $(this).datepicker('hide');
        });
        }
    });

HTML:

<div class="input-group date">
    <input type="text" id="datepicker<?=$j?>" required name="joindate<?=$j?>" class="date_picker form-control" placeholder="show datepicker" maxlength="100"  autoplete="off"><span class="input-group-addon" id="basic-addon2"><i class="fa fa-calendar"></i></span>
    <input type="hidden" name="roleid<?=$j?>" value="<?=$str[$j]?>"  />
</div>

In am using a calendar in bootsrtap datepicker, in that I have displaying only month and year (mm-yyy). I want to disable future months from current month. I have searched a lot but I didn't find an answer. Please help me, I have attached my code below

JS :

$(document).ready(function () {

        var cou = $('#rolecount').val();
        var c;

        for (c = 0; c <=cou; c++){
            $('#datepicker'+c).datepicker({
            format: 'mm-yyyy',
            endDate: '+0d',
            viewMode: "months", 
            minViewMode: "months",
            });  

        $('#datepicker'+c).datepicker().on('monthSelected', function(ev){
            $(this).datepicker('hide');
        });
        }
    });

HTML:

<div class="input-group date">
    <input type="text" id="datepicker<?=$j?>" required name="joindate<?=$j?>" class="date_picker form-control" placeholder="show datepicker" maxlength="100"  autoplete="off"><span class="input-group-addon" id="basic-addon2"><i class="fa fa-calendar"></i></span>
    <input type="hidden" name="roleid<?=$j?>" value="<?=$str[$j]?>"  />
</div>

• javascript
• jquery
• datepicker

Share Improve this question Follow edited Jan 5, 2015 at 13:34 user4399775 asked Jan 5, 2015 at 13:24 VijaykarthikVijaykarthik 33344 gold badges1010 silver badges2525 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

You need to redefine your endDate option value:

$('.input-daterange').datepicker({
   format: 'mm-yyyy',
   // You used '+0d' that is for days instead of '+0m' that is for months.
   endDate: '+0m',
   viewMode: "months", 
   minViewMode: "months"
})