Jquery UI:datepicker

Question

I'm using Jquery UI datepicker in one of my projects. I need to disable US holiday dates. I tried jQuery UI Datepicker - Disable specific days and Can the jQuery UI Datepicker be made to disable Saturdays and Sundays (and holidays)?

But they didn't work. How can I make the special days unselectable.

I also tried it with http://tokenposts.blogspot.com/2011/05/jquery-datepicker-disable-specific.html, snippet is working appart, but not in my project. Here it's:

var unavailableDates = ["31-12-2012"];

function unavailable(date) {
  dmy = date.getDate() + "-" + (date.getMonth()+1) + "-" + date.getFullYear();
  if ($.inArray(dmy, unavailableDates) == -1) {
    return [true, ""];
  } else {
    return [false,"","Unavailable"];
  }
}


Drupal.behaviors.date_popup = function (context) {
  for (var id in Drupal.settings.datePopup) {
    $('#'+ id).bind('focus', Drupal.settings.datePopup[id], function(e) {
      if (!$(this).hasClass('date-popup-init')) {
        var datePopup = e.data;
        // Explicitely filter the methods we accept.
        switch (datePopup.func) {
          case 'datepicker':
            $(this)
              .datepicker({ minDate: +1, maxDate: "+3Y", beforeShow: unavailable })
              .addClass('date-popup-init')
            $(this).click(function(){
              $(this).focus();
            });
            break;

          case 'timeEntry':
            $(this)
              .timeEntry(datePopup.settings)
              .addClass('date-popup-init')
            $(this).click(function(){
              $(this).focus();
            });
            break;
        }
      }
    });
  }
};

If they worked for the OP who posted the questions, I can't see why it wouldn't for you... unless you show us the code you are trying and tell us **what** doesn't work — JMax, Dec 29 '11 at 10:34

score 0 · Answer 1 · answered Dec 29 '11 at 10:32

0

some more information on what exactly you've tried till now would be great, but anyway: this (very simple) tutorial worked perfect for me - just a basic function returning true/false too beforeShowDay.

answered Dec 29 '11 at 10:32

oezi

51,017
10
98
115

I tried that your link but it's workin appart, but if integrate it with my project it's not working. – orif Dec 29 '11 at 10:51

score 0 · Accepted Answer · answered Dec 30 '11 at 06:58

I found the decision. Just use the "beforeshow" attribute first of all other functions.

natDays = [
    [1, 1, 'New Year'],
    [1, 16, 'Martin Luther King'],
    [1, 20, 'Inauguration Day'],
    [2, 14, "St. Valentine's Day"],
    [2, 20, "Washington's Day"],
    [5, 21, 'Memorial Day'],
    [6, 4, 'Independence Day'],
    [9, 3, 'Labour Day'],
    [11, 11, 'Veterans Day'],
    [11, 22, 'Thanks Giving Day'],
    [12, 25, 'Christmas'],
    [1, 7, 'Custom']
];

function nationalDays(date) {
    for (i = 0; i < natDays.length; i++) {
        if (date.getMonth() == natDays[i][0] - 1
                && date.getDate() == natDays[i][1]) {
            return [false, natDays[i][2] + '_day'];
        }
    }
    return [true, ''];
}

function noWeekendsOrHolidays(date) {
    var noWeekend = $.datepicker.noWeekends(date);
    if (noWeekend[0]) {
        return nationalDays(date);
    } else {
        return noWeekend;
    }
}


Drupal.behaviors.date_popup = function (context) {
    for (var id in Drupal.settings.datePopup) {
        $('#' + id).bind('focus', Drupal.settings.datePopup[id], function(e) {
            if (!$(this).hasClass('date-popup-init')) {
                var datePopup = e.data;
                // Explicitely filter the methods we accept.
                switch (datePopup.func) {
                    case 'datepicker':
                        $(this)
                                .datepicker({
                                                beforeShowDay: noWeekendsOrHolidays,
                                                minDate:+1,
                                                maxDate:"+3Y"
                                            })
                                .addClass('date-popup-init')
                        $(this).click(function() {
                            $(this).focus();
                        });
                        break;

                    case 'timeEntry':
                        $(this)
                                .timeEntry(datePopup.settings)
                                .addClass('date-popup-init')
                        $(this).click(function() {
                            $(this).focus();
                        });
                        break;
                }
            }
        });
    }
};

Jquery UI:datepicker

2 Answers2