[SOLVED] Can I disable specific, individual dates in jQuery UI's datepicker?

Can I disable specific, individual dates in jQuery UI's datepicker?

I have an application where I have some PHP logic that returns a JSON array of dates that I want BLOCKED from selection in a jQuery UI datepicker. I am returning this array from the logic:

["2013-03-14","2013-03-15","2013-03-16"]

Is there a simple way to tell the jQuery UI datepicker "block these dates from selection in the datepicker"?

I've read the jQuery UI documentation and I see nothing that helps me.

Solution

You can use beforeShowDay to do this. The following example disables the dates you listed in your question via a declared array:

var array = ["2013-03-14","2013-03-15","2013-03-16"]

$('input').datepicker({
    beforeShowDay: function(date){
        var string = jQuery.datepicker.formatDate('yy-mm-dd', date);
        return [ array.indexOf(string) == -1 ]
    }
});

<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/themes/redmond/jquery-ui.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<input />

JSFiddle demo