如何在Google Docs下拉框变更时用google.script.run调用服务端函数？

针对你遇到的侧边栏下拉框变更时服务端doSomething函数未执行的问题，可按以下方案排查修复：

1. 添加错误捕获，定位问题根源 #

当前代码未处理google.script.run的调用失败情况，导致即使出错也无提示。修改客户端JS代码，添加失败回调：

function dropdownChanged(dropdown) {
  var selectedValue = dropdown.value;
  alert("Selected value: " + selectedValue);
  google.script.run
    .withFailureHandler(function(error) {
      alert("调用服务端函数失败：" + error.message);
      console.error(error);
    })
    .doSomething(selectedValue);
}

这样能直接捕获调用失败的原因，比如权限问题、函数不存在、参数错误等。

2. 修正HTML输出方式，避免潜在渲染问题 #

原代码中html.append(generateHtml(classes))的写法可以简化为直接创建HTML输出，同时确保HTML结构正确：

function showSidebar() {
  var sheet = SpreadsheetApp.openById("XXXXXXXXXXXXX").getSheetByName("Sheet1");
  var data = sheet.getSheetValues(1, 1, sheet.getLastRow(), sheet.getLastColumn());
  var classes = [];
  for(var i = 0; i < sheet.getLastColumn()-1; i++) {
    classes.push(data[i][0]);
  }

  // 直接用生成的HTML创建输出，替代append方式
  var html = HtmlService.createHtmlOutput(generateHtml(classes))
                        .setTitle("选择班级"); // 添加标题更规范
  DocumentApp.getUi().showSidebar(html);
}

3. 修复服务端函数的潜在空值问题 #

如果当前文档没有设置页眉，doc.getHeader()会返回null，调用appendParagraph会导致静默失败。修改doSomething函数：

function doSomething(value) {
  var doc = DocumentApp.getActiveDocument();
  var header = doc.getHeader();
  
  // 若没有页眉则创建一个
  if (!header) {
    header = doc.addHeader();
  }
  
  // 可选择清空原有页眉内容，避免重复添加
  header.clear();
  header.appendParagraph(value);
}

4. （可选）改用HTML模板，避免字符串拼接的转义风险 #

手动拼接HTML字符串容易出现引号转义、特殊字符问题，推荐使用HtmlService模板：

1. 在脚本编辑器中创建一个新的HTML文件（比如Sidebar.html），内容如下：

<base target="_top">
<select id="myDropdown" onchange="dropdownChanged(this)">
  <? for(var i=0; i<options.length; i++) { ?>
    <option value="<?= options[i] ?>"><?= options[i] ?></option>
  <? } ?>
</select>

<script>
function dropdownChanged(dropdown) {
  var selectedValue = dropdown.value;
  alert("Selected value: " + selectedValue);
  google.script.run
    .withFailureHandler(function(error) {
      alert("调用失败：" + error.message);
    })
    .doSomething(selectedValue);
}
</script>

2. 修改showSidebar函数加载模板：

function showSidebar() {
  var sheet = SpreadsheetApp.openById("XXXXXXXXXXXXX").getSheetByName("Sheet1");
  var data = sheet.getSheetValues(1, 1, sheet.getLastRow(), sheet.getLastColumn());
  var classes = [];
  for(var i = 0; i < sheet.getLastColumn()-1; i++) {
    classes.push(data[i][0]);
  }

  var template = HtmlService.createTemplateFromFile("Sidebar.html");
  template.options = classes;
  var html = template.evaluate().setTitle("选择班级");
  DocumentApp.getUi().showSidebar(html);
}

完成以上修改后，重新打开文档的FCAR菜单启动侧边栏，即可看到调用失败的具体原因，同时修复服务端函数的潜在问题，确保下拉框变更时服务端函数正常执行。

内容的提问来源于stack exchange，提问作者William Martell