How can I use JQuery Datepicker to highlight with two days two special dates?

I mean, I found a way to disable the array of national days here.

I am trying to code to disable national days as well as highlight some other days (I am coding a web application and I will go through another array of days), but so that they are enabled.

Imagine a calendar where you can see three different colors of the day. First, today. Secondly, fruitless national days. And in the third color, on different days when something special happens.

Is it possible.

Also where can I find the css codes in the datepicker ui for changing the default date and disabled date css properties.

Thanks in advance.

+2


source to share


1 answer


Based on the function from the page you linked to:



$(".selector").datepicker({ beforeShowDay: specialAndNationalDays});

natDays = [
  [1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'],
  [4, 27, 'za'], [5, 25, 'ar'], [6, 6, 'se'],
  [7, 4, 'us'], [8, 17, 'id'], [9, 7, 'br'],
  [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']
];
speDays = [
  [1, 10, 'mbd'], // Moms Bday
  [7, 20, 'dbd']  // Dads Bday
];

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 specialAndNationalDays(date) {
    for (i = 0; i < speDays.length; i++) {
      if (date.getMonth() == speDays[i][0] - 1
          && date.getDate() == speDays[i][1]) {
        return [true, speDays[i][2] + '_day']; 
        // first variable in return enables(true)/disables(false) the date
      }
    }
  return nationalDays(date);
}

      

+3


source







All Articles