Disable Dates In The Datepicker Based On Values From The Google Sheet Using Google Apps Script

From the html I made with date picker, if a date was selected and submitted, it's output will be saved in the Google Sheet. Here is the sample output: here is the html code: &

Solution 1:

• You want to disable the dates of weekends and the dates retrieved from the values of Spreadsheet for the datepicker.
  • In your sample Spreadsheet, you want to disable August 20, 2019, July 26, 2019, July 19, 2019 and the weekends.

If my understanding is correct, how about this modification? Please think of this as just one of several answers.

Modified script:

Please modify the function of populateDates() of HTML & Javascript side as follows.

functionpopulateDates(disabledDays){
  var dateSelect = document.getElementById('subDate');
  M.Datepicker.init(dateSelect, {
    minDate: newDate ("2019, 5, 10"), 
    maxDate: newDate ("2019, 8, 21"), 
    disableWeekends: true,
    disableDayFn: function(day){ // Modifiedreturn disabledDays.some(e => {
        var obj = newDate(e);
        return obj.getFullYear() == day.getFullYear() && obj.getMonth() == day.getMonth() && obj.getDate() == day.getDate();
      });
    }
  });
}

Note:

• In this case, the values of disabledDays from revealDates() of Google Apps Script are the string values. So the string values are converted to the date object at the script of disabledDays = disabledDays.map(e => new Date(e)).
• In this modification, I didn't modify Google Apps Script.

Reference:

• some()