如何在事件`submit`按钮之后传递`HtmlService.createHtmlOutput()`的值?

时间:2015-01-07 20:05:55

标签: html google-apps-script

在下面的代码中,arrayStored函数中未定义submit。我尝试通过arrayStored方法获取e.parameter值(不起作用)。我是HtmlService的新手,我正在阅读文档。如何在事件HtmlService.createHtmlOutput()按钮后传递submit的值?我是否必须创建一个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
 }

2 个答案:

答案 0 :(得分:2)

在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文件中。假设您将其称为&#39;侧边栏&#39;

<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>

答案 1 :(得分:1)

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

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

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

var arrayStored = HtmlService.createHtmlOutput();

然后你设置了一些内容:

arrayStored.setContent(arrayListString);

但我不知道它会被退回(发送到浏览器)。