How does the beforeShowDay method work? (JQuery UI datepicker)

Question

I have been trying to find a clear explanation for a considerable time, but I just can't figure out how this method works. The following is the official jQuery UI API documentation. It may be clear to others, but I find it a little vague. I just want to take an array of dates and disable them. I can make all dates non-selectable, not the ones I want.

beforeShowDayType: function (date)

Default: null

A function that takes a date as a parameter and should return an array with:

[0]: true / false indicating whether this date is selected [1]: CSS class name to add to the date cell or "" for the default view [2]: optional tooltip for this date

The function is called for each day in the datepicker before it is displayed.

---

This is my (incomplete) code.

$(document).ready(function() {
    var array = ["2014-01-03","2014-01-13","2014-01-23"];
    $('#fromDate').datepicker({
        dateFormat: "yy-mm-dd",
        beforeShowDay: function(date) {
            {
                return [false, "", "Booked out"];
            } else {
                return [true, "", "available"];
            }
        }
    });
});

Answer 1

Try the following:

beforeShowDay: function(date) {
    if($.inArray($.datepicker.formatDate('yy-mm-dd', date ), array) > -1)
    {
        return [false,"","Booked out"];
    }
    else
    {
        return [true,'',"available"];
    }
}