google-apps-script - 谷歌应用程序脚本: a select drop down list in google sheet

标签 google-apps-script google-sheets dialog

我已经开始在谷歌表格中使用谷歌应用程序脚本,我想创建一个对话框,用户将在其中编写我稍后将使用的输入。对话框应该有一个下拉列表,可以提出建议或完成输入。

最佳答案

对于通过 Google 搜索到达这里的任何人:

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

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

然后选择一个单元格,例如 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>

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

关于google-apps-script - 谷歌应用程序脚本: a select drop down list in google sheet,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/71219901/

相关文章:

html - 使用 Google Apps 脚本在电子邮件正文中将 Google Doc 作为 HTML 发送,同时保留格式

javascript - 尝试编写自定义复制/粘贴 Google 表格脚本

if-statement - 在 Google 表格公式中引用另一个单元格两次返回错误

android - 如何在自定义对话框的边界上获取十字按钮/图像?

javascript - 如何在 Apps 脚本的 HTML 表单中使用户输入不区分大小写?

javascript - 如果一个选项卡上的列中的值与其他选项卡上的列不匹配,Google 表格将删除行

javascript - 3个依赖于Javascript的下拉列表

javascript - Google Sheet 应用程序脚本时间戳条件

checkbox - 如何在对话框中添加复选框并获取值?

android - Dialog.setTitle 不会显示全文