在google电子表格的“渲染/加载自”列中使用HTML填充HTML下拉菜单_Html_Google Apps Script

在google电子表格的“渲染/加载自”列中使用HTML填充HTML下拉菜单

html google-apps-script

在google电子表格的“渲染/加载自”列中使用HTML填充HTML下拉菜单,html,google-apps-script,Html,Google Apps Script,我按照这个过程从侧栏中的谷歌电子表格栏中获得了一个下拉列表，它通过点击一个按钮工作。首先，我想有它被加载时，侧栏加载，而不是让它运行后，点击一个按钮。发送“我有一个提交脚本”，该脚本从侧栏获取值，并将其传递给另一个函数，该函数在工作表上更新该值，单击下拉列表按钮触发，因此它不会显示下拉列表你能帮我弄清楚侧边栏打开时如何加载下拉列表吗请参阅下面的代码代码.gs function openSidebar() { var ss = SpreadsheetApp.getActiveSpre

我按照这个过程从侧栏中的谷歌电子表格栏中获得了一个下拉列表，它通过点击一个按钮工作。首先，我想有它被加载时，侧栏加载，而不是让它运行后，点击一个按钮。发送“我有一个提交脚本”，该脚本从侧栏获取值，并将其传递给另一个函数，该函数在工作表上更新该值，单击下拉列表按钮触发，因此它不会显示下拉列表

你能帮我弄清楚侧边栏打开时如何加载下拉列表吗

请参阅下面的代码

代码.gs

function openSidebar() {
    var ss = SpreadsheetApp.getActiveSpreadsheet();
    var sn = ss.getSheetByName("Sheet1");
    var ri = sn.getRange('A1').getValue();
    var pval = sn.getRange(ri, 2).getValue();

    var html = HtmlService.createTemplateFromFile('Page');
    html.pageid = sn.getRange('A1').getValue();
    html.todaysdate = Utilities.formatDate(new Date(),"CST", "MM/dd");
    html.pastnote = pval;

    var rendered = html.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME)
    .setTitle('Add Note / Interaction')
    .setWidth(100)
    .setHeight(200);

    SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
    .showSidebar(rendered);
}

function getValuesFromSpreadsheet() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1");
  return sheet.getRange(1, 4, sheet.getLastRow(), 1).getValues(); // Retrieve values and send to Javascript
}

function processForm(formObject) {
  var ui = SpreadsheetApp.getUi();
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sn = ss.getSheetByName("Sheet1");
  var pvalr = sn.getRange(formObject.rowID, 2);
  var pval = formObject.pNote;
  var nxtstpR = sn.getRange(formObject.rowID, 3);
  var nxtstp = formObject.NxtStp;
  var string = '';
  if (pval != ''){
    string = "\n"+pval;
  }
  var string = formObject.tdDate+"-"+formObject.initial+"\n"+formObject.note+string;
  pvalr.setValue(string);
}

Page.html

<!DOCTYPE html>
<script>
  function loadManufacturers() {
    google.script.run.withSuccessHandler(function(ar) {
      let select = document.createElement("select");
      select.id = "select1";
      select.setAttribute("onchange", "selected()");
      document.getElementById("NxtStp").appendChild(select);
      ar.forEach(function(e, i) {
        let option = document.createElement("option");
        option.value = i;
        option.text = e;
        document.getElementById("select1").appendChild(option);
      });
    }).getValuesFromSpreadsheet();
  };

  function selected() {
    const value = document.getElementById("select1").value;
    console.log(value);
  }
</script>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    Please fill in the form and hit submit<br><br>
    <form id="myForm" onsubmit="google.script.run.withSuccessHandler(google.script.host.close).processForm(this)">
      <input type="hidden" name="rowID" value=<?= pageid ?>>
      <input type="hidden" name="tdDate" value=<?= todaysdate ?>>
      <input type="hidden" name="pNote" value=<?= pastnote ?>>
      Your initial:<br>
      <input type="text" name="initial" required="required"><br><br>
      Interaction type:<br>
      <input type="radio" name="iType" value="In Office"> In Office<br>
      <input type="radio" name="iType" value="Skype"> Skype<br>
      <input type="radio" name="iType" value="Phone Call"> Phone Call<br>
      <input type="radio" name="iType" value="Email" required="required"> Email<br><br>
      Your note:
      <textarea name="note" cols="30" rows="10" required="required"></textarea><br><br>
      <div class="dropdown">
        <button onclick="loadManufacturers()" class="dropbtn">Update Next Step</button>
        <div id="NxtStp" class="dropdown-content"></div>
      </div>
      <br><br><br>
      <input type="submit" value="Submit">
    </form><br>
    <input type="button" value="Cancel" onclick="google.script.host.close()" />
  </body>
</html>


函数loadManufacturers（）{
google.script.run.withSuccessHandler（函数（ar）{
让select=document.createElement（“select”）；
select.id=“select1”；
select.setAttribute（“onchange”，“selected（）”；
document.getElementById（“NxtStp”）.appendChild（选择）；
ar.forEach（函数（e，i）{
let option=document.createElement（“option”）；
option.value=i；
option.text=e；
document.getElementById（“select1”）.appendChild（选项）；
});
}).getValuesFromSpreadsheet（）；
};
所选函数（）{
const value=document.getElementById（“select1”）.value；
console.log（值）；
}
请填写表格并点击提交


>

您希望在侧边栏打开时加载下拉列表

如果我的理解是正确的，这次修改怎么样？请把这看作是几个可能的答案之一
在当前脚本中，单击“更新下一步”按钮时，loadManufacturers（）
将加载下拉列表。使用这个，下面的修改如何
修改脚本：
有两个修改点
发件人：
致：

通过此修改，当单击Submit
按钮时，可以使用formObject检索所选值。在processForm（formObject）
中选择1

注:

另外，在这次修改中，虽然我不确定这是否是您想要的，因为您的问题中没有显示这一点，但是删除更新下一步如何


如果我误解了你的问题，而这不是你想要的方向，我道歉。首先，非常抱歉这么晚才将你的答案标记为正确答案。还想知道您是否可以帮助我如何在所需字段上进行值选择？现在我无法设置窗体要求选择值。谢谢Taizoon Khokar
<script>
  function loadManufacturers() {

<script>
  loadManufacturers(); // Added

  function loadManufacturers() {

select.id = "select1";
select.setAttribute("onchange", "selected()");

select.id = "select1";
select.name = "select1"; // Added
select.setAttribute("onchange", "selected()");