要从 Google 电子表格捕获的 HTML 选择选项-解网

问：

我花了几天时间来克服这个问题，但没有运气。

我在 Google 脚本中有一个 html 页面，我想要一个下拉列表 - 这是按如下方式实现的

<div>
<select name="source">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
</div>

现在，我希望从电子表格中捕获选项字段，而不是手动输入，如果列范围增加或减少，下拉列表应相应地更新。

请有任何解决方法...

问候

html google-apps-script google-sheets google-sheets-api

你都试过了什么？问题的示例代码肯定有助于确定发生潜在错误的位置。特别是下面的答案似乎是你要找的。每当您获取数据范围时，它都会查询该特定列中有多少个对象。当信息发生更改时，下拉列表不会立即更改，并且仅在刷新或通过 UI 执行命令时才会更改。

0赞 Vasim 7/23/2013

jsfiddle.net/c6242/1916 这是我使用的代码，这给出了工作表中的内容列表，但是如何将它们添加到下拉列表中？？对不起，我还是个新手。

0赞 Vasim 7/23/2013

如果我只使用 data[i][j] 而不使用 select，它会给出所需的列表，但如何将它们添加到下拉列表中.....（评论已添加到 aviod 混淆）

答：

2赞 wchiquito 7/22/2013 #1

您可以查看文档，特别是将部分变量推送到模板，保险可能很有用。

3赞 Mogsdad 7/23/2013 #2

这是对 Html 服务：最佳实践文档中演示的技术的改编。

Code.gs

function doGet() {
  var template = HtmlService
                 .createTemplateFromFile('DynamicList');

  var htmlOutput = template.evaluate()
                   .setSandboxMode(HtmlService.SandboxMode.NATIVE);

  return htmlOutput;
}

function getListOptions() {
  // In production code, get an array of options by
  // reading a spreadsheet.
  var options = ['Saab','Opel','Audi'];

  return( options );
}

DynamicList.html

<div>
  <select id="optionList">
    <option>Loading...</option>    
  </select>

</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
</script>
<script>
// This code in this function runs when the page is loaded.
$(function() {
  google.script.run.withSuccessHandler(buildOptionList)
      .getListOptions();
});

function buildOptionList(options) {
  var list = $('#optionList');
  list.empty();
  for (var i = 0; i < options.length; i++) {
    list.append('<option value="' + options[i].toLowerCase() + '">' + options[i] + '</option>');
  }
}
</script>

<?
 var sheet   =  SpreadsheetApp.openById(0Avt7ejriwlxudGZfV2xJUGJZLXktQ2RhQU1ugtgtaXc").getSheetByName("MRF Tab");
  var lastRow = sheet.getLastRow();  
  var myRange = sheet.getRange("C3:C"+lastRow); 
  var data    = myRange.getValues();
  ?>
<div>
  <select>
    <? for (var i = 0; i < data.length; ++i) { ?>
      <option><?!= data[i] ?></option>
    <? } ?>
  </select>
</div>

在模板中混合数据获取代码和 html UI 代码确实是一个坏主意。您应该使用单独的 gs 和 html 文件，并按照 Mogsdad 的建议应用优化。

要从 Google 电子表格捕获的 HTML 选择选项

HTML select option to be captured from Google Spreadsheet

评论

Code.gs

DynamicList.html

评论

评论