Twitter Bootstrap datepicker: how to enable only specific daterange

16,746

Solution 1

The similar question you linked to ended up using quite a hack, but what you want is a lot simpler -- you're looking for the startDate and endDate options:

$('#dp1').datepicker({
    format: 'mm-dd-yyyy',
    startDate: '-15d',
    endDate: '+0d' // there's no convenient "right now" notation yet
});

These options can take Date objects, timedelta strings (as I did here), or date strings following the given format.

Demo: http://jsfiddle.net/zNbUT/131/

Also, make sure you're using the code from github -- eyecon.ro's copy is the original code, with old bugs and without the newer features.

Solution 2

var startDate = new Date();
startDate.setDate(startDate.getDate()-15);

var endDate = new Date();

$('#dp1')
.datepicker().on('changeDate', function(ev){
    if (ev.date.valueOf() > endDate.valueOf()){
       alert('The date selected is too far in the future.');
    } else if (ev.date.valueOf() < startDate.valueOf()){
        alert('The date selected is too far in the past');
    } else {
        alert('fine')
    }

});

http://jsfiddle.net/XSmx6/14/

Share:
16,746
Admin
Author by

Admin

Updated on June 13, 2022

Comments