Google Script 和 Google Sheets - 下拉选择单元格并从侧边栏输入添加值

Question

我一直在从其他来源拼凑脚本，感觉自己很接近但无法自己完成最后的飞跃。 只是为了给你一些背景

我正在 Google Sheets 中整理一份文档，我可以让学生输入来自现场足球比赛的特定值，这些值将在 OBS 上用作我们视频广播的实时统计数据。 我为篮球制作了一个非常简单的按钮表，它的效果非常好。 Google 篮球表的图片

足球是一种不同的野兽。 我的概念是有一个侧边栏，在那里我有一组在下拉菜单中预选的名称以及第二个下拉菜单，其中包含预选的统计类型下拉列表（匆忙，传递......）这两个下拉菜单会找到与名称行）和统计类型（列）相关联的单元格以及为选定单元格添加值的输入字段。

我一直无法弄清楚如何将下拉菜单与特定单元格关联，更不用说两个不同的下拉菜单了。 如果这两个下拉菜单是不可能的，我很高兴制作一个按钮来与特定的播放相关联，然后下拉名称和输入字段就可以了。

到目前为止我所拥有的 - 我有一个下拉菜单，可以从 A 列中提取名称，但是当我选择一个时，什么也没有发生。 我还有一个按钮，我可以将一个值发送到特定的单元格，但它不会添加到原始单元格，它只是将单元格更改为“输入值”1

 function ftball() { try { var output = HtmlService.createHtmlOutputFromFile('HTML_Sidebar'); SpreadsheetApp.getUi().showSidebar(output); } catch(err) { Logger.log(err); } } function getNames() { var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Football"); return sheet.getRange(1, 1, sheet.getLastRow(), 1).getValues(); // Retrieve values and send to Javascript } // Sets the value of A1 cell to value entered in the input field in the side bar! function enterValue(number){ var ss = SpreadsheetApp.getActive() var sheet = ss.getActiveSheet() sheet.getRange("B11").setValue(number + 1) }

和侧边栏的 HTML

 <!DOCTYPE html> <html> <head> <base target="_top"> </head> <body> <select id="mySelect" onchange="selectChange(this)"> </select> <script> function selectChange(select) { google.script.run.changeSheet(select.value); } function playerNames(names) { var select = document.getElementById("mySelect"); for( var i=0; i<names.length; i++ ) { var option = document.createElement("option"); option.text = names[i]; select.add(option); } } (function () { google.script.run.withSuccessHandler(playerNames).getNames(); }()); </script> <button onclick='f1()'>Select Athlete Name</button> </br> <!-- Create a input field to except a value form user, in this case there name --> Enter Value: <input type="number" id="number"><br> <!-- Create a button to send the value to the spreadsheet --> <button onclick='sendValue()'>Send Value</button> <script> function f1() { google.script.run.getAddress(); } function sendValue(){ //Get the value of the input field var number = document.getElementById("number").value //Log the value of input field in the web browser console (usually used for debugging) console.log(number) //Send the value of the text field as a arugment to the server side function. google.script.run.enterValue(number) } </script> </body> </html>

Answer 1

我可以使用我自己的示例数据从您的数据中创建一些内容，但不确定这是否是您想要的，但我尝试根据我在您的帖子中理解的内容进行调整。 请参阅下面的输出和代码。

代码.gs：

function ftball() {
  try {
    var output = HtmlService.createHtmlOutputFromFile('HTML_Sidebar');
    SpreadsheetApp.getUi().showSidebar(output);
  }
  catch(err) {
    Logger.log(err);
  }
}

function getData() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Football");
  return [sheet.getRange(1, 1, sheet.getLastRow(), 1).getValues().filter(String),  // Retrieve names and
          sheet.getRange(1, 2, sheet.getLastRow(), 1).getValues().filter(String)]; // Stat types then send to Javascript (remove blank cells)
}

function enterValue(number, name, stat){
  var ss = SpreadsheetApp.getActive();
  var sheet = ss.getActiveSheet();
  
  var namesLength = sheet.getRange(1, 1, sheet.getLastRow(), 1).getValues().filter(String).length;
  var statsLength = sheet.getRange(1, 2, sheet.getLastRow(), 1).getValues().filter(String).length;
  // where your name headers for the table starts (C6)
  var nameStartRow = 6;
  var nameStartCol = 3;
  // where your stat headers for the table (D5)
  var statStartRow = 5;
  var statStartCol = 4;
  // get list of names
  var names = sheet.getRange(nameStartRow, nameStartCol, namesLength, 1).getValues().flat();
  var stats = sheet.getRange(statStartRow, statStartCol, 1, statsLength).getValues().flat();
  // find the position by adjusting the index of name/stat to where the list starts
  var namePosition = names.indexOf(name) + nameStartRow;
  var statPosition = stats.indexOf(stat) + statStartCol;
  // get previous value, assign 0 if blank.
  var previousValue = sheet.getRange(namePosition, statPosition).getValue() || 0;
  sheet.getRange(namePosition, statPosition).setValue(parseInt(previousValue) + parseInt(number));  
}

HTML_Sidebar.html：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <select id="mySelectNames"></select>
    <select id="mySelectStats"></select><br>
    Enter Value:
    <input type="number" id="number"><br>
    <button onclick='sendValue()'>Send Value</button>
    <script>
      function setOptions([names, stats]) {
        // set both names and stats drop down
        var select = document.getElementById("mySelectNames");
        for( var i=0; i<names.length; i++ ) {
          var option = document.createElement("option");
          option.text = names[i];
          select.add(option);
        }
        // set default value to first option
        select.selectedIndex = 0;

        var select2 = document.getElementById("mySelectStats");
        for( var i=0; i<stats.length; i++ ) {
          var option2 = document.createElement("option");
          option2.text = stats[i];
          select2.add(option2);
        }
        select2.selectedIndex = 0;
      }
      function sendValue(){
        // send the values of name, stat and number then set as value
        var number = document.getElementById("number").value;
        var name = document.getElementById("mySelectNames").value;
        var stat = document.getElementById("mySelectStats").value;

        //Send the value of the text field as a arugment to the server side function.
        google.script.run.enterValue(number, name, stat);
      }
      (function () { google.script.run.withSuccessHandler(setOptions).getData(); }());
    </script>
  </body>
</html>

输出：

笔记：

我修改了您的 html 和应用程序脚本。 但我希望它接近你想要实现的目标。
这里的重要一点是如何找到给定名称和统计值的值的位置。 这就是我认为您可以根据您的数据和想要的输出使用和修改的内容。
代码需要不填充 A 和 B，因此表格有点靠右。 但是，如果我们确切地知道名称和统计信息的列表，则可以避免这种情况。

Google Script 和 Google Sheets - 下拉选择单元格并从侧边栏输入添加值

问题描述

1 个解决方案

解决方案1
0 已采纳 2021-06-30 16:37:02

代码.gs：

HTML_Sidebar.html：

输出：

笔记：

Google Script 和 Google Sheets - 下拉选择单元格并从侧边栏输入添加值

问题描述

1 个解决方案

解决方案1 0 已采纳 2021-06-30 16:37:02

代码.gs：

HTML_Sidebar.html：

输出：

笔记：

解决方案1
0 已采纳 2021-06-30 16:37:02