Bootstrap datepicker configuration to block specific dates (holidays)

Question

Has anyone figured out how to configure datepicker to not display specific dates (such as, say, July 4th)? It would seem that this could be done using the beforeShowDay but I'm not positive.

Solution 1

http://jsfiddle.net/Lr3taznx/

//a array of dates that should be blocked
var forbidden=['12/25/2014','12/24/2014']

$('#datepicker').datepicker({
    beforeShowDay:function(Date){
        //
        var curr_day = Date.getDate();
        var curr_month = Date.getMonth()+1;
        var curr_year = Date.getFullYear();        
        var curr_date=curr_month+'/'+curr_day+'/'+curr_year;        

        if (forbidden.indexOf(curr_date)>-1) return false;        
    }
})

OR:

http://jsfiddle.net/zsqvjvkd/1/

var forbidden=['2014-12-25','2014-12-24']

$('#datepicker').datepicker({
    beforeShowDay:function(Date){
        var curr_date = Date.toJSON().substring(0,10);

        if (forbidden.indexOf(curr_date)>-1) return false;        
    }
})

Solution 2

With version 1.3.1+ you can simply use datesDisabled option: http://bootstrap-datepicker.readthedocs.org/en/latest/options.html#datesdisabled

Comments

[Scott C Wilson]

Just before the beforeShowDay function I also added daysOfWeekDisabled: "0", in order to block sundays as well.

[Davi Lima]

With version 1.3.1+ you can simply use datesDisabled option: bootstrap-datepicker.readthedocs.org/en/latest/…

[Davi Lima]

Also see: stackoverflow.com/questions/10234153/…

[Anupal]

Quick question and how: Can we only change the background color to some for only warning to user while picking dates ?