Update:

Updated date format in HTML and assigned today's date to data, although date range limit not restricting.

New fiddle: /

==========

I'm trying to a create a datepicker which allows the user to select a year and month. Currently, I'm confused as to why the start month is 2013, and why the start date limit is not preventing me to go beyond x year?

Here's the code: /

Docs:

• /

Code here because rules:

<div id="dpMonths" class="input-append date" data-date-minviewmode="months"
    data-date-viewmode="years" data-date-format="mm-yyyy"
>
    <input type="text" readonly=""> 
    <span class="add-on">
        <i class="icon-th"></i>
    </span>
</div>

$('#dpMonths').data({
    date: '01/01/2000'
});

$('#dpMonths').datepicker('update');

$('#dpMonths').datepicker({
    startDate: '+10y'
}).on('changeDate', function (ev) {
    console.log(ev.date);
});

I set the datepicker data, because it'll break otherwise, wasn't sure how to get round it/nor do I know why it get's overwritten with today's date/month.

Update:

Updated date format in HTML and assigned today's date to data, although date range limit not restricting.

New fiddle: http://jsfiddle/D9Xav/143/

==========

I'm trying to a create a datepicker which allows the user to select a year and month. Currently, I'm confused as to why the start month is 2013, and why the start date limit is not preventing me to go beyond x year?

Here's the code: http://jsfiddle/D9Xav/140/

Docs:

• http://www.eyecon.ro/bootstrap-datepicker/
• https://github./eternicode/bootstrap-datepicker

Code here because rules:

<div id="dpMonths" class="input-append date" data-date-minviewmode="months"
    data-date-viewmode="years" data-date-format="mm-yyyy"
>
    <input type="text" readonly=""> 
    <span class="add-on">
        <i class="icon-th"></i>
    </span>
</div>

$('#dpMonths').data({
    date: '01/01/2000'
});

$('#dpMonths').datepicker('update');

$('#dpMonths').datepicker({
    startDate: '+10y'
}).on('changeDate', function (ev) {
    console.log(ev.date);
});

I set the datepicker data, because it'll break otherwise, wasn't sure how to get round it/nor do I know why it get's overwritten with today's date/month.

• javascript
• twitter-bootstrap
• datepicker

1 Answer 1

It looks like the date value 01/01/2000 needs to be in the same format as the date format you chose: mm-yyyy. So it needs to be 01-2000.

$('#dpMonths').data({
    date: '01-2000'
});

You could add that value into your HTML as a data attribute instead though, e.g. data-date="01-2000"

Once you make that change, the date limit will also work.

[edit] After you've updated to the new version, change your javascript part to just this:

$('#dpMonths')
    .datepicker({
        startDate: '-3y',
        format: 'mm-yyyy'
})
    .on('changeDate', function (ev) {
    console.log(ev.date);
});

Fiddle: http://jsfiddle/SdZBF/5/