将函数输出添加到sidbar

时间:2018-05-06 16:49:14

标签: google-apps-script google-sheets

我正在尝试将函数OplionList()的输出添加到侧边栏

侧边栏打开但没有输出

我猜测函数OplionList()没有被读取

不确定我可以提供更多细节

经过数小时努力寻求帮助

由于

Code.gs

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('Refresh')
      .addItem('Get Option List', 'displayOptionList')
      .addToUi();     
};


function displayOptionList(){
  var ui = HtmlService.createTemplateFromFile('Sidebar')
    .evaluate()
    .setSandboxMode(HtmlService.SandboxMode.IFRAME)
    .setTitle('Option List');
SpreadsheetApp.getUi().showSidebar(ui);

};

Sidebar.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>

    <div id="OP"></div>
    <script>
       function OplionList() {
       var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1");
       var lr = sheet.getLastRow();
       var values = sheet.getRange(2, 1, lr, 3).getValues();
       values = values.filter(function(e){return e[0] && e[1] && e[2]});
       var result = [];

       //Add items to results
       for(var i=0; i<values.length; i++){ // Modified
         result[i] = ["option {<br />label: \"" + values[i][1] + "\";<br />" + "selector: [\"" + values[i][0] + "\"=\"" + values[i][2] + "\"];<br />}<br />"];
       };

       var temp = ""
       for(var i=0; i<result.length; i++){ // Modified
          temp = temp +  [result[i] + "\n"];
       };

       temp = "target: \" element \";<br />" +"as dropdown;<br />" + temp + "}"

       return temp

      };
    </script>    
  </body>
</html>

2 个答案:

答案 0 :(得分:1)

您的脚本存在一些问题。

1)你的OplionList()&#39;函数已声明但未调用。您仍然需要显式调用该函数(请参阅下文)或将代码包装在一个立即调用的函数表达式中。

<body>
    <h1>Hello world</h1>
    <script>

   function myFunc(){
    console.log(5);
   }

   myFunc(); //calls the function

    </script>
  </body>

<script>
 (function(){

   console.log(5);

  })();

2)其次,您无法从客户端直接调用Apps脚本功能。客户端代码由浏览器呈现,而GAS代码在Google服务器上执行,因此不会共享执行环境。像SpreadsheetApp,DocumentApp和其他应用程序脚本类无法神奇地转移到您的本地浏览器程序。也就是说,Google确实提供了一种使用异步JavaScript API调用GAS函数的方法。

考虑移动&#39; OplionList()&#39;到.gs文件,使用google.script.run从客户端调用它,然后使用客户端函数将HTML字符串注入页面。服务器函数的输出作为参数传递给&#39; withSuccessHandler&#39;打回来。这是在“&div;”中呈现服务器生成内容的最简单方案:

<body onload="populateContainer()">
<div id="container">Loading...</div>
...
<script>
var container = document.getElementById("container");

function populateContainer(){

google.script.run
             .withSuccessHandler(function(html){
                  container.innerHTML = html;
              })
             .withFailureHandler(function(error){ console.log(error);})
             .OplionList(args);

}

</script>
</body>

有关GAS https://developers.google.com/apps-script/guides/html/communication

中客户端 - 服务器通信的更多详细信息

另一种方法是使用scriptlet来构建模板 https://developers.google.com/apps-script/guides/html/templates#scriptlets

请注意,这会使您的代码运行速度变慢。

答案 1 :(得分:1)

请记住,Google Apps脚本服务类和方法仅作为服务器端代码提供。更具体地说,我们无法在客户端代码上使用SpreadsheetApp。

关于未读取的OptionList函数,客户端代码不包含对该函数的调用。

请查看Dialogs and Sidebars in G Suite Documents上的指南。