MNorup
MNorup

Reputation: 135

bootstrap-datepicker from/to range by month

I'm using the https://github.com/eternicode/bootstrap-datepicker

My form is consisting of a From Date and a To Date input (#fromdate/#todate).

The minViewMode is set to months for both.

Once a From Date is selected, the user should be able to select ONLY from the #fromdate value PLUS one month.

Ie. if user selects March in From Date, only April and forwards should be selectable in the To Date .datepicker.

Disabling months prior to #fromdate for #todate is handled like so:

$("#fromdate").datepicker({
minViewMode: 1
}).on('changeDate', function(ev){
    $("#todate").datepicker('setStartDate',ev.date);
});

I am probably missing something obvious, but I can't seem to get a grip on "adding" 1 month to the setStartDate method.

Upvotes: 0

Views: 4258

Answers (3)

Sirlan Moraes
Sirlan Moraes

Reputation: 1

I made a more complete solution:

$("#eventEndDate").datepicker({
        minViewMode: 1
    }).on('changeDate', function (ev) {
        endtDate: ev.date.setMonth(ev.date.getMonth() - 1), $("#eventStartDate").datepicker('setEndDate', ev.date);
    });

    $("#eventStartDate").datepicker({
        minViewMode: 1
    }).on('changeDate', function (ev) {
        startDate: ev.date.setMonth(ev.date.getMonth() + 1), $("#eventEndDate").datepicker('setStartDate', ev.date);
    });

Upvotes: 0

Paulo Segundo
Paulo Segundo

Reputation: 448

You need to set minDate:

$("#fromdate").datepicker({
    minViewMode: 1
}).on('changeDate', function(ev){
    $("#todate").datepicker("option", "minDate",ev.date.setMonth(ev.date.getMonth() + 1));
});

Upvotes: 0

demo
demo

Reputation: 6245

You need to set endDate for user.

The latest date that may be selected; all later dates will be disabled.

Check docs for bootstrap-datepicker http://bootstrap-datepicker.readthedocs.org/en/release/options.html#enddate

Upvotes: 0

Related Questions