javascript - 如果使用 Google App Script 在某个日期达到其限制，则更改选项值（时间）

Question

我在谷歌脚本中有一个时间列表，它反映在 Web 应用程序中。我是从 youtube.com 得到的。这是网络应用程序和谷歌表的屏幕截图。

网络应用：

谷歌表（表名称：“Time_Select”）：

这些代码用于使用 javascript 和 google 脚本在 html 中生成或输出时间。

html代码：

          <div class="input-field col s4">
             <select id="subTime">
                <option value="" disabled selected>Choose your preferred time</option>
                <?!= list1; ?> 
             </select>
             <label>Select Time</label>
          </div> <!-- CLOSE TIME FIELD -->
       </div> <!-- CLOSE ROW --> 

从上面的 html 代码中，插入它是为了从谷歌表中填充列表。

javascript:

<?!= list1; ?>

谷歌脚本：

function doGet(e){

  var ss = SpreadsheetApp.openByUrl(url);
  var ws1 = ss.getSheetByName("Time_Select");
  var list1 = ws1.getRange(1,1,ws1.getRange("A1").getDataRegion().getLastRow(),1).getValues();
  var htmlListArray1 = list1.map(function(r){return '<option>' + r[0] + '</option>'; }).join(''); 

  var tmp = HtmlService.createTemplateFromFile("test");
  tmp.list1 = htmlListArray1; 
  return tmp.evaluate();

}

现在，我的问题是如果列表中的时间值达到我的选择限制，我该如何更改它。顺便说一句，如果您在我的网络应用程序中选择了时间和日期，这是输出数据。

输出谷歌表（表名称：“Test_Data”）

从上面的数据来看，某天早上8点和9点达到了3次，我想改成“这个时间已经满了，请再选一个”。

总结一下，我想检查某个日期的时间是否达到限制，然后将时间选择更改为“此时间已满，请选择另一个”。

我尝试添加另一个函数来检查特定日期的时间是否达到限制但不能更改选择中的时间值：

function timeLimit(){

  var ss = SpreadsheetApp.openByUrl(url);
  var ws = ss.getSheetByName("Test_Data");
  var dataRg = ws.getRange(1, 7, ws.getLastRow(), 2).getValues(); 
  var myData = [];


  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] >= 3;});
    //return limit_reached;
    Logger.log(limit_reached);
  };
   var dataDisable = CheckLimitReached(dataRg);
  Logger.log(dataDisable);

}

预先感谢您的帮助。

标签： javascripthtmlgoogle-apps-scriptgoogle-sheets

Answer 1

尝试以下工作流程：

该doGet()函数返回一个 HTML 网页

-> 网页有一个下拉菜单可以选择日期

-> 在提交按钮上单击一个 JS 函数将被调用，该函数将所选日期传递到.gs代码部分

-> 在.gs应用程序脚本函数中检查所选日期哪些时间段仍然可用

-> 网页中的第二个下拉菜单，包含时间，将动态填充此特定日期可用的时间段列表

更详细：

在 HTML 中

• 结合提交按钮实现日期的列表/其他选择方法：

<select id="Date">
 <option value="" disabled selected>Choose your preferred day</option>
    ...
</select>
<input type="button" onClick="passDate()" value="Confirm date">

• <script></script>在HTML 文件的一部分中编写一个passDate()函数，将所选选项传递给 Apps 脚本函数：

function passDate(date){
var dropdown=document.getElementById('Date');
var date=dropdown.options[dropdown.selectedIndex].value;
google.script.run.withSuccessHandler(onSuccess).timeLimit(date);
  }

应用脚本：

• 编写一个函数，查找所有已为特定intimeLimit(date)保留的时隙：dateTest_Data

function timeLimit(){
  var ss = SpreadsheetApp.openByUrl(url);
  var ws = ss.getSheetByName("Test_Data");
  var dataRg = ws.getRange(1, 7, ws.getLastRow(), 2).getValues(); 
  var myData = [];
  for(var i=0;i<dataRg.lenth:i++){
   if(dataRg[0][i]==date){
    myData.push(dataRg[1][i])
    }
   } 

• 通过编写一个检测数组中每个元素的出现的函数来查找超过允许限制的时间值：

function getAllIndexes(arr, val) {
    var indexes = [], i = -1;
    while ((i = arr.indexOf(val, i+1)) != -1){
        indexes.push(i);
    }
    return indexes;
}

• 并为从 t 检索到的每个可能的时隙运行它Time_Selec，测试发生率是否高于允许的限制，并仅将未达到限制的时隙推入 htmlListArray1：

 var ws1 = ss.getSheetByName("Time_Select");
 var list1 = ws1.getRange(1,1,ws1.getRange("A1").getDataRegion().getLastRow(),1).getValues();
 var limit=3;
 var htmlListArray1 = []
for (var j=0;j<list1.length;j++){
  if(!getAllIndexes(myData, list1[0][j]).length>=limit){
  htmlListArray1.push('<option>' + list1[0][j] + '</option>'; }); 
   }
  }
  htmlListArray1.join(''); 
  return htmlListArray1; 
  }

• onSuccess()在JS中实现函数

<script></script>HTML 的一部分

带有活动选项的列表将从返回值动态插入function timeLimit()到下拉菜单中的文件：

function onSuccess(htmlListArray1) {        
        document.getElementById('subTime').innerHTML = htmlListArray1;
      }

当您打开时间选择下拉菜单时 - 只会出现一个包含可用时间段的列表。

注意：请doGet()相应地调整您的功能。