CODEWITHSUNDEEP
javascriptjquerydateuser-interfacedatepicker
r584
r584

Reputation: 157

jQuery Datepicker only show Mondays and disable certain Mondays

I'm having trouble trying to combine only showing Mondays as well as disabling specific dates on the beforeShowDay parameter of the jQuery datepicker... I want the user to only be able to select Mondays, except for 2/20/2012 and 2/27/2012 but am not sure how to implement this...

    <script type="text/javascript">
        var unavailableDates = ["20-02-2012", "27-12-2012"];
        function unavailable(date) {
        dmy = (date.getDay() == 1);
        if ($.inArray(dmy, unavailableDates) == -1) {
            return [true, ""];
        } else {
            return [false, "", "Unavailable"];
        }
        }
    </script>
    <script type="text/javascript">
       $(function () {
          $("#datepicker").datepicker({
            beforeShowDay: unavailable,
            minDate: 0
          });
       });
    </script>

Upvotes: 1

Views: 3989

Answers (1)

Andrew Whitaker
Andrew Whitaker

Reputation: 126042

You need to compare the passed in date with another date object. Instead, you're comparing it with items in an array of strings.

I would use valueOf or getTime, which return the number of milliseconds since 01 January UTC to make the comparison:

var unavailableDates = [
    new Date(2012, 1, 20).valueOf(),
    new Date(2012, 1, 27).valueOf()
];

function unavailable(date) {
    if (date.getDay() === 1 && $.inArray(date.valueOf(), unavailableDates) < 0) {
        return [true, ""];
    } else {
        return [false, "", "Unavailable"];
    }
}

$(document).ready(function() {
    $("#date").datepicker({
        beforeShowDay: unavailable
    });
});​

Example: http://jsfiddle.net/aThZG/

Upvotes: 1

Related Questions