我看到许多使用UiApp的例子,但无法弄清楚如何使用HtmlService。例如:
var app = UiApp.getActiveApplication();
...
app.createListBox().setName('list').setId('list')
...
app.getElementById('list').clear();
app.getElementById('list').addItem(...);
使用HtmlService,如何使用这样的列表框创建HTML文件?我会采用相同的方法吗?
答案 0 :(得分:3)
HtmlService与UiApp根本不同,但与“普通”HTML开发非常接近,因为该应用程序主要基于客户端。因此,您可能熟悉UiApp的方法在HtmlService中没有直接的等价物。实际上,“服务”只提供了组装和显示用户界面的方法,并实现了它们与服务器端GAS功能之间的安全通信。
这是一个简单的示例,它创建一个包含使用模板化HTML填充的列表的表单。提交后,它会发布到doPost()
函数。 (注意:将脚本发布为Web应用程序。)
// Adapted from http://stackoverflow.com/a/11300412/1677912
function doGet(e) {
var template = HtmlService.createTemplateFromFile('Form.html');
template.action = ScriptApp.getService().getUrl();
template.listId = "browsers";
template.datalist = ["Internet Explorer","Firefox","Chrome","Opera","Safari"];
return template.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
function doPost(e) {
var template = HtmlService.createTemplateFromFile('Thanks.html');
template.browser = e.parameter.browsers;
return template.evaluate();
}
<html>
<body>
<h1>Select a browser</h1>
<form action="<?= action ?>" method="post">
<input list="<?= listId ?>" name="<?= listId ?>">
<datalist id="<?= listId ?>">
<? for (var i=0; i<datalist.length; i++) { ?>
<option value="<?= datalist[i] ?>">
<? } ?>
</datalist>
<input type="submit" value="Submit" />
</form>
</body>
</html>
<html>
<body>
<h1>Thanks</h1>
<p>Thank you for your response.</p>
Browser: "<?= browser ?>"<br/>
</body>
</html>