google 应用程序脚本：select 下拉列表 google sheet

Question

我已经开始在 google 工作表中使用 google 应用程序脚本，我想创建一个对话框，用户可以在其中输入我稍后会用到的内容。对话框应该有一个下拉列表，可以提出建议或完成输入。

Answer 1

对于通过 Google 搜索来到这里的任何人：

Google 工作表中的下拉列表可以通过数据验证来实现。创建一列条目。让我们这样说：

A4 = Apples  
A5 = Tigers  
A6 = Coriander  
A7 = Forest

然后 select 一个单元格，比如 B4。现在转到顶部菜单中的数据。选择数据验证。将打开一个带有选项的模块。选择“从范围中列出”。作为条件，然后输入 A4:A7 作为范围。您可以选择拒绝其他输入。现在将鼠标悬停在 B4 上并单击箭头。您会看到现在有一个内联下拉菜单。知道您可以将列表源添加到另一个选项卡，甚至向用户隐藏该选项卡以保持界面整洁可能会很有用。

现在，回答你的实际问题。

您希望下拉菜单出现在弹出窗口中。这是可以做到的！它不如使用带有数据验证的内联下拉菜单那么快，但它更漂亮。

假设您至少了解 Google Apps 脚本的基础知识，代码如下：

function onOpen() {
  SpreadsheetApp.getUi()
    .createMenu('Custom Menu')
    .addItem('Multiple choice', 'dropDownModal')
    .addToUi();
}

function dropDownModal() {
  var htmlDlg = HtmlService.createHtmlOutputFromFile('dropdown.html')
    .setSandboxMode(HtmlService.SandboxMode.IFRAME)
    .setWidth(350)
    .setHeight(175);
    
  SpreadsheetApp.getUi()
    .showModalDialog(htmlDlg, 'A Title Goes Here');
};

function writeChoice(selection) {
  const writeResponseLocation = "B4";

  SpreadsheetApp
    .getActiveSpreadsheet()
    .getSheets()[0]
    .getRange(writeResponseLocation)
    .setValue(selection);
}

然后创建一个名为 dropdown.html 的文件（除了上面的 code.gs 文件外）并输入以下内容：

<!DOCTYPE html>
<html>

<head>
  <base target="_top">
</head>

<script>
  function onSuccess() {
    google.script.host.close();
  }

  function submit() {
    const choice = document.getElementById('choice').value;

    google.script.run
      .withSuccessHandler(onSuccess)
      .writeChoice(choice);
  }
  
  function setup() {
    const button = document.getElementById('submitbutton');
    button.addEventListener("click", submit)
  }
</script>

<body onload="setup()">
  <p>
    There will be a slight delay on submission.
  </p>
  <form>
    <select id="choice">
      <option value="apple">Apple</option>
      <option value="banana">Banana</option>
      <option value="coriander">Coriander</option>
      <option value="monkey">Monkey</option>
    </select>
    <button id="submitbutton">Submit</button>
  </form>
</body>

</html>

现在保存所有内容并重新加载 sheet。菜单栏的末尾将出现一个名为“自定义菜单”的菜单。 Select 然后选择多项选择。您必须授予自己对运行您输入的代码的许可才能使其正常工作（然后再次选择菜单选项）。这样就可以了。调整代码以满足您的需要。

google 应用程序脚本：select 下拉列表 google sheet

google apps script : a select drop down list in google sheet

dialog

google-sheets

google-apps-script

现在，回答你的实际问题。