使用 Google Apps 脚本根据 Google 表格中的值禁用日期选择器中的日期

Question

从我用日期选择器制作的 html 中，如果选择并提交了一个日期，它的输出将保存在 Google 表格中。

这是示例输出：

这里是html代码：

 <div class="row">
 <div class="input-field col s4">
         <input id="subDate" type="text" class="datepicker">
         <label for="subDate">Select Date</label>
 </div> 

这里是 datePicker 示例：

如您所见，日历中有一些禁用日期。这是由于以下 java 脚本中的选项：

<script>

 document.addEventListener('DOMContentLoaded', function() {
   var timeSelect = document.querySelectorAll('select');
   M.FormSelect.init(timeSelect);

   google.script.run.withSuccessHandler(populateDates).revealDates();                            

  });

   function populateDates(disabledDays){
   var disabledDays = [new Date("2019, 12, 25").valueOf(), new Date("2019, 7, 18").valueOf()];
   var dateSelect = document.getElementById('subDate');
   M.Datepicker.init(dateSelect, {
                        minDate: new Date ("2019, 5, 10"), 
                        maxDate: new Date ("2019, 8, 21"), 
                        disableWeekends: true,
                        disableDayFn: function(day){
                           return disabledDays.indexOf(day.valueOf()) > -1;
                        }
                        });

   }
</script>

如果在列中达到 5 次，我想禁用谷歌表中的重复日期。在上面的示例输出中，您会注意到：

August 20, 2019
July 26, 2019
July 19, 2019

在该列中存在 5 次。现在，为了只获取存在 5 次的值，我使用了从 @Christopher Bradley 获得的代码

Google Apps 脚本：

function revealDates(){

  var ss = SpreadsheetApp.openByUrl(url);
  var ws = ss.getSheetByName("Test_Data");
  var dateRg = ws.getRange(1, 9, ws.getLastRow(), 1).getValues();

  var CheckLimitReached = function (T)
  {
   var records= {};
   T.forEach(function (x) { records[x] = (records[x] || 0) + 1; });
   var limit_reached = Object.keys(records).filter(function (R) {
   return records[R] >= 5;});
   return limit_reached;
  };

 var dateDisable = CheckLimitReached(dateRg);
 Logger.log(dateDisable);
 return dateDisable;
 }

这段代码的日志是：

我想禁用以下日志/结果的日期。要禁用它，我想我需要将它放在 javascript 的 disabledDays 数组中。我用过

google.script.run.withSuccessHandler(populateDates).revealDates();

但我仍然无法禁用日期。我认为它应该采用

的格式

new Date("2019, 12, 25").valueOf()

@Rubén 给出了这个代码：

for(var i = 0; i < dateDisable.length; i++){
  var testDate = Utilities.formatDate(dateDisable[i], "GMT+8","yyyy, MM, dd");
  Logger.log(testDate);
}

因为它导致了错误，所以我尝试这样做：

var testDate = Utilities.formatDate(new Date(dateDisable[i]), "GMT+8","yyyy, MM, dd");

并记录它的结果是：

不过，我无法禁用日期选择器中的日期。

Answer 1

• 您希望禁用周末日期以及从日期选择器的电子表格值中检索的日期。
  • 在您的示例电子表格中，您希望禁用 August 20, 2019、July 26, 2019、July 19, 2019 和周末。

如果我的理解是正确的，那么这个修改呢？请认为这只是几个答案之一。

修改脚本：

请修改HTML&Javascript端populateDates()的函数如下。

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

注意：

• 在这种情况下，来自 Google Apps 脚本的revealDates() 的disabledDays 的值是字符串值。所以字符串值在disabledDays = disabledDays.map(e => new Date(e))的脚本中被转换为日期对象。
• 在此修改中，我没有修改 Google Apps 脚本。

参考：

• some()