Google Sheets Api - 从另一个工作表读取的附加组件

Question

问题描述：

我想在我的 google sheet (g-1) 上创建一个插件。当用户打开插件时，我想立即阅读另一个谷歌电子表格 (g-2) 并根据这些列填充 g-1 上的下拉列表。

我已启用 Googlesheet Api 在 Code.js 中：

function readSpreadsheet() {
  var questions = Sheets.Spreadsheets.Values.get("_ID_", "SHEET!A2:k").values
  if (!questions) {
    return 'No data found.';
  } else {
    return questions
  }
}

上面的函数有效，因为如果我将它添加到插件的标题中，我会看到正确的列数：

HtmlService.createHtmlOutputFromFile('QuestionBank').setTitle(readSpreadsheet().length)

或者我可以打印第一行

readSpreadsheet()[0]

............

到目前为止一切顺利。

现在在我的 html 文件 QuestionBank.html 中，

问题 #1。我无法调用readSpreadsheet，它返回未定义。 var question_rows 返回未定义。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>

  /**
    read all rows, upon clicking on sync button. But this is not necessary if I can populate the dropdowns on load
  **/


  $(function() {
    $('#sync').click(readSpreadsheet);
  });

  function readSpreadsheet() {
    this.disabled = true;
    $('#error').remove();
    var question_rows = google.script.run
        .withSuccessHandler(
          function(textAndTranslation, element) {
            element.disabled = false;
          })
        .withFailureHandler(
          function(msg, element) {
            element.disabled = false;
          })
        .withUserObject(this)
        .readSpreadsheet();

        for (var row = 0; row < question_rows.length; row++) {
          alert(question_rows[row])
        }
  }
</script>

问题 #2：我有几个下拉列表，我希望它们的值是 g-2 列的唯一值。我希望在加载项打开时填充这些下拉列表。

<select class="filter">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

所以我想要我的数据的第一列，唯一值，而不是沃尔沃等

问题 #3：如果无法加载，我可以包含一个按钮来读取数据并填充下拉列表

<button class="sync-button" id="sync">sync</button> 

Answer 1

下面的答案怎么样？

问题 #1 的答案

google.script.run 不返回值。当它使用来自 google.script.run 的值时，在您的情况下，textAndTranslation 的 withSuccessHandler 是返回值。所以你可以修改readSpreadsheet()如下。

function readSpreadsheet() {
  this.disabled = true;
  $('#error').remove();
  google.script.run
      .withSuccessHandler(withSuccessHandler)
      .withFailureHandler(
        function(msg, element) {
          element.disabled = false;
        })
      .withUserObject(this)
      .readSpreadsheet();
}

function withSuccessHandler(textAndTranslation, element) {
  element.disabled = false;
  var question_rows = textAndTranslation;
  for (var row = 0; row < question_rows.length; row++) {
    alert(question_rows[row])
  }
}

问题 #2 的答案

您可以通过将 google.script.run 放入 $(function() {}) 来实现。样品如下。这是一个样本。所以请把变量修改成你自己的。

<select class="filter"></select>
<script>
$(function() {
  google.script.run.withSuccessHandler(sample).readSpreadsheet();
});

function sample(data) {
  for (var i=0; i < data.length; i++) {
    $('.filter').append($('<option>').html(data[i]).val(data[i]));
  }
}

问题#3的答案

当然，您可以使用按钮将值设置为<select class="filter"></select>。

如果我误解了你的问题，我很抱歉。