2

I am trying to only allow the first Friday of every month to be selectable in my jQuery UI Datepicker and deny any other date.

I realise I could do this with a combination of PHP and jQuery by getting the date of the first Friday for X months in the future, then adding them to a javascript array that I check against within Datepicker's beforeShowDay - something like this:

var allowedDates = new Array();
allowedDates[] = <?=date("d/m/Y",strtotime("first Friday of February 2012"))?>
allowedDates[] = <?=date("d/m/Y",strtotime("first Friday of March 2012"))?>
allowedDates[] = <?=date("d/m/Y",strtotime("first Friday of April 2012"))?>

(I would of course put this in a for loop rather than typing each month manually)

The problem with this is that it is limiting due to me having to specify how far in the future to look. So is there a way with javascript to check to see if the date checked in Datepicker's beforeShowDay is the first of the month without me having to specify how far into the future to check?

Thanks!

SammyBlackBaron
  • 847
  • 3
  • 13
  • 31
  • I don't know if it can be done, but if cannot be done, I would attach an event (probably blur - i.e. out of focus) and change the user selected date to 1st of that month.. but it would require informing the user that only 1st can be selected. not best, but it's one way out.. – iamserious Feb 24 '12 at 17:00
  • Is this the jQuery UI datepicker or another kind? – j08691 Feb 24 '12 at 17:17
  • Yes, the jQuery UI datepicker – SammyBlackBaron Feb 24 '12 at 17:21
  • possible duplicate of [Datepicker for web page that can allow only specific dates to be clicked](http://stackoverflow.com/questions/1890418/datepicker-for-web-page-that-can-allow-only-specific-dates-to-be-clicked) – j08691 Feb 24 '12 at 17:32
  • If they can only pick the first friday of a month, is a datepicker really necessary? Why not just offer a select list of months? As you described, you can easily figure out the correct date server-side. – Brian Glaz Feb 24 '12 at 17:34

1 Answers1

2

this should do the trick for you:

jQuery('#datepicker').datepicker({
    beforeShowDay: function(date) {
        var day = date.getDay();
        var day2 = date.getDate();
        return [(day == 5 && day2 <= 7), ''];   
    }
});

As you can see here.

DarkAjax
  • 15,955
  • 11
  • 53
  • 65