javascript - Twitter Bootstrap datepicker: how to enable only specific daterange - Stack Overflow

admin管理员组

文章数量:1220537

I am working on some project based on Twitter Bootstrap which using a datepicker from (that is a fork from some other version), but it's missing a very important feature that I need - how to enable only specific date range (eg. from past 15 days till today), so any other date can't be even selected (not clickable).

I found a similar solution here on SO, which disables Saturdays and Sundays: Limit bootstrap-datepicker to weekdays only? / , but I dont know how to adjust it to my needs.

Thanks in advance.

I am working on some project based on Twitter Bootstrap which using a datepicker from https://github.com/eternicode/bootstrap-datepicker (that is a fork from some other version), but it's missing a very important feature that I need - how to enable only specific date range (eg. from past 15 days till today), so any other date can't be even selected (not clickable).

I found a similar solution here on SO, which disables Saturdays and Sundays: Limit bootstrap-datepicker to weekdays only? http://jsfiddle.net/katowulf/zNbUT/5/ , but I dont know how to adjust it to my needs.

Thanks in advance.

• javascript
• jquery
• twitter
• twitter-bootstrap
• datepicker

Share Improve this question Follow edited May 23, 2017 at 12:08 CommunityBot 111 silver badge asked Sep 29, 2012 at 11:54 jabbaleskujabbalesku 7311 gold badge11 silver badge33 bronze badges 0

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 14

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.

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/

本文标签： javascriptTwitter Bootstrap datepicker how to enable only specific daterangeStack Overflow