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