Question

我希望有3个带有标签的文本字段和侧边栏上的一个按钮，单击该按钮应将文本字段的内容发送到电子表格脚本功能以进行进一步处理。我知道如何创建和显示侧边栏，也知道如何通过单击按钮触发脚本功能，但不知道如何发送文本字段内容。

// SidePanel.html
<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <button onclick='f1()'>Update the address</button>
<script>
  function f1() {
    google.script.run.getAddress();
  }
</script>
  </body>
</html>

// display sidebar in gs
function showSidebar(){
  var html = HtmlService.createHtmlOutputFromFile('SidePanel').setTitle('Helper').setWidth(100);
  SpreadsheetApp.getUi().showSidebar(html);
}

Answer 1

这里是一个示例，可以帮助您了解如何将边栏中的值发送到Google工作表

HTML代码：

    <!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <button onclick='f1()'>Update the address</button>
    <!-- Create a input field to except a value form user, in this case there name -->
    Your Name:
    <input type="text" id="name"><br>
    <!-- Create a button to send the value to the spreadsheet -->
    <button onclick='sendName()'>Send Name</button>
<script>

  function f1() {
    google.script.run.getAddress();
  }

  function sendName(){
   //Get the value of the input field 
   var name = document.getElementById("name").value
   //Log the value of input field in the web browser console (usually used for debugging)
   console.log(name)
   //Send the value of the text field as a arugment to the server side function.
   google.script.run.enterName(name)
  }
</script>
  </body>
</html>

上面的HTML代码使用input field从用户那里获取值。您可以使用DOM methods访问输入字段的值。文本字段的值存储在var name中的function sendNames()中。将此作为参数google.script.run.enterName(name)传递到google脚本函数。

您的Google脚本（又名服务器端代码）

function showSidebar(){
  var html = HtmlService.createHtmlOutputFromFile('SO_sideBar_Example').setTitle('Helper').setWidth(100);
  SpreadsheetApp.getUi().showSidebar(html);
}

// Sets the value of A1 cell to value entered in the input field in the side bar!
function enterName(name){
 var ss = SpreadsheetApp.getActive()
 var sheet = ss.getActiveSheet()
 sheet.getRange("A1").setValue(name) 
}

在上述服务器端代码中，function enterName()在参数name中接收用户输入，该参数输入在单元格A1中。

按照here的详细说明使用withSuccessHandler（）和withFailureHandler（）是一个好习惯。处理服务器端代码的成功或失败。

如何将输入数据从Google电子表格侧边栏发送到工作表脚本功能？

1 个答案: