访问客户端javascript

时间:2017-03-08 17:39:03

标签: javascript html google-apps-script

尝试在google-script中创建一个webapp,允许用户选择工作表,命名和创建日历。

我以为我可以将解析为json的所有重要信息推送到客户端,然后只使用那里的脚本访问template.data的不同部分,然后再调用google脚本代码来创建日历。但我甚至不能用我点击的名字发出警报。

所以我期望在下面的代码中发生的是单击任何列表项只会返回<li>内的文本,但是每个列表项都会发出警告“未定义”

我在code.gs中的doGet()

function doGet() {
  // Parse all sheets available and set as element to template
  var template = HtmlService.createTemplateFromFile("ui");
  var spreadsheet = SpreadsheetApp.openByUrl(url);

  var sheets = spreadsheet.getSheets();
  var json = [];
  sheets.forEach(function(sheet){
    json.push(getScheduleAsJSON(sheet));
  });
  template.data = json;  
  return template.evaluate();
}

我的ui.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      function getName(){
        alert(this.InnerHTML);
      }
    </script>
  </head>
  <body>
    <ul id="SheetList">
      <? for (var i = 0; i < data.length; i++){?>
        <li onclick="getName();">
          <?=data[i].name;?>
        </li>
      <?}?>
    </ul>
    <ul id="NameList">
      <li onclick="getName();">foo</li>
    </ul>
  </body>
</html>

编辑1:

所以看起来我甚至在尝试HTML部分时都会蠢蠢欲动,改变这些部分。

<li onclick="getSheetName(this);">
  <?=data[i].name;?>
</li>

function getSheetName(item){
  console.log(item.innerHTML);
}

仍然希望能够以某种方式访问​​jsons计算服务器端的数组而无需调用google.script.run每个函数。

编辑2:

想想我已经找到了我正在寻找的东西; PropertiesService。我仍然不知道如何实现和实际访问我认为我已经存储在其中的数据。到目前为止我尝试过的所有东西总是产生相同的“未定义”结果。目前在我的脚本属性中将整个json存储为字符串,无法访问console.log上的任何内容,但是根本不确定这是否实际上是向前一步。

所以目前已添加到我的doGet():

var properties = PropertiesService.getScriptProperties();
properties.setProperty("schedule-data", JSON.stringify(data));

使用google.script.run.onsuccesshandler.myfunc()调用此函数:

function getProperties(){
  var properties = PropertiesService.getScriptProperties();
  return properties.getProperty("schedule-data")[0].name;
}

Logger.log(json [0] .name)返回“2017年3月”,所以仍然完全失去了为什么我没有在html方面得到任何东西......

1 个答案:

答案 0 :(得分:1)

您缺少需要使用“scriptlet”加载到HTML中的initializeDatabase()

data

您可以在以下链接的文档中查看示例:

Calling Apps Script functions from a template

ui.html

<? var data = getData(); ?>

Code.gs

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
      window.onload = function myOnloadFunc() {
        console.log('The Web App has loaded')
        google.script.run
         .withSuccessHandler(funcToRunOnSuccess)
         .getData();
      }

      window.funcToRunOnSuccess = function(returnedData) {

        window.mySpreadsheetData = returnedData;
        console.log('window.mySpreadsheetData: ' + window.mySpreadsheetData)
      }

    </script>
  </head>
  <body>
    <div>Anything</div>

    <? var data = getData(); ?>

    <ul id="SheetList">
      <? for (var i = 0; i < data.length; i++){?>
        <li onclick="getName();">
          <?= data[i]; ?>
        </li>
      <?}?>
    </ul>

    <ul id="NameList">
      <li onclick="getName();">foo</li>
    </ul>
  </body>
</html>