如何在事件“提交”按钮之后传递“HtmlService.createHtmlOutput()”的值？

Question

在下面的代码中，arrayStored没有在submit函数中定义。我尝试通过 e.parameter 方法获取 arrayStored 值（无效）。我是 HtmlService 的新手，正在阅读文档。如何在事件 submit 按钮后传递 HtmlService.createHtmlOutput() 的值？我是否必须创建一个 HTML 文件来存储它？

function showList(folderID) {
  var folder = DocsList.getFolderById(folderID);
  var files = folder.getFiles();
  var arrayList = [];
  for (var file in files) {
    file = files[file];
    var thesesName = file.getName();
    var thesesId = file.getId();
    var thesesDoc = DocumentApp.openById(thesesId);
    for (var child = 0; child < thesesDoc.getNumChildren(); child++){
    var thesesFirstParagraph = thesesDoc.getChild(child);
    var thesesType = thesesFirstParagraph.getText();
      if (thesesType != ''){
         var newArray = [thesesName, thesesType, thesesId];
         arrayList.push(newArray);
         break;
         }
      }
   }
  arrayList.sort();
    var mydoc = SpreadsheetApp.getActiveSpreadsheet();
    var app = UiApp.createApplication().setWidth(550).setHeight(450);
    var panel = app.createVerticalPanel()
                   .setId('panel');
    var label = app.createLabel("Selecione os itens desejados").setStyleAttribute("fontSize", 18);
    app.add(label);
    panel.add(app.createHidden('checkbox_total', arrayList.length)); 
    for(var i = 0; i < arrayList.length; i++){      
      var checkbox = app.createCheckBox().setName('checkbox_isChecked_'+i).setText(arrayList[i][0]);
      panel.add(checkbox);
   }
   var handler = app.createServerHandler('submit').addCallbackElement(panel);
   panel.add(app.createButton('Submit', handler));
   var scroll = app.createScrollPanel().setPixelSize(500, 400);  
  var arrayListString =  JSON.stringify(arrayList);
  var arrayStored = HtmlService.createHtmlOutput();
  arrayStored.setContent(arrayListString);
  scroll.add(panel);
  app.add(scroll);
  mydoc.show(app);
}

function submit(e){
  var savedArray = arrayStored.getContent();
  Logger.log("savedArray #2 = " + savedArray);
  // continues...
}

function include(arr, obj) {
    for(var i=0; i<arr.length; i++) {
        if (arr[i] == obj) // if we find a match, return true
            return true;    }
    return false; // if we got here, there was no match, so return false
 }

Answer 1

在 HtmlService 中将参数传递给您需要在 HTML 文件中调用 google.script.run.functionName(parameters) 的服务器函数

总而言之，您需要使用 javascript 使用 <script> 标签将函数绑定到提交按钮。该函数将收集所有表单数据并将其作为参数传递给 google.script.run.functionName(parameters) 调用

此外，您似乎在混合使用 HtmlService 和 UiService。后者已于上个月弃用，现在可以随时停止工作。建议是完全在 HTML 文件上构建侧边栏。

编辑：因为我不明白你到底想在你的代码中做什么，这里有一个简单的例子：

你code.gs文件

function showSidebar() { // this is used to show the sidebar in the document
  var html = HtmlService.createHtmlOutputFromFile('sidebar') //sidebar is the name of your HTML file
  .setTitle('My custom sidebar')
  .setWidth(300);
  SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
  .showSidebar(html);
};

function doSomething(txt) { //that is the function called in your html file
  Logger.log('Input text: '+ txt);
};

在你的 HTML 文件中。假设你称它为 'sidebar'

<form>
  <input type="text" name="sample" id="sample">
  <input type="button" value="Submit" onclick="callServer()">
</form>

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

<script>
   function callServer() { //this is the function called when pressing the submit button
     var text = $('#sample').val();
     google.script.run.doSomething(text); //this will call the doSomething() server function with the argument text
   };
</script>

Answer 2

您正在创建一个可以返回的 HTML 对象，但我没有看到代码将它提供给浏览器。通常，HTML 内容在 doGet() 函数中提供给浏览器：

function doGet() {
  return HtmlService.createHtmlOutput('<b>Hello, world!</b>');
}

代码创建了一个 HTML 输出对象：

var arrayStored = HtmlService.createHtmlOutput();

然后你设置一些内容：

arrayStored.setContent(arrayListString);

但我没有看到它被返回（发送到浏览器）。

如何在事件“提交”按钮之后传递“HtmlService.createHtmlOutput()”的值？

How can I pass the value of a `HtmlService.createHtmlOutput()` after the event `submit` button?

html

google-apps-script