将google脚本值传递给html [英] Pass google script value to html
问题描述
我一直在寻找各种其他解决方案，但这些解决方案似乎都不适合我。
我试图从我的谷歌脚本（最初存储在谷歌的PropertiesService中）将一个变量传递给我的html，因为我想使用先前保存的数据作为值为我的文本输入框（显示以前保存的数据）。
这是我的gs文件（减去不相关的部分）：
函数openSettings（）{
var htmlTemplate = HtmlService.createTemplateFromFile（'settingsForm'）
var userProperties = PropertiesService.getUserProperties（）;
var time = userProperties.getProperty（'selectedTime'）;
htmlTemplate.timehtml = time;
var html htmlTextBox.evaluate（）。 .getUi（）
.showSidebar（html）;
return html
}
function processForm（form）{
var userProperties = PropertiesService.getUserProperties（）;
var time = userProperties.getProperty（'selectedTime'）;
time = form.time;
userProperties.setProperty（'selectedTime'，time）;
}
这是我的html文件（省略其他无关的部分） p>
<！DOCTYPE html>
< html>
< div>
< form>
< input type =textname =timeid =timestyle =width：40px;>
< br>< br>< input type =buttonclass =actiononClick =writeFormData（）;
alert（'submitted'）value =Submit/> ;
< / form>
< / div>
< script>
var timeInput = document.getElementById（time）;
var timehtml = time;
timeInput.value = timehtml;
< / script>
< script type =text / javascript>
函数writeFormData（）{
google.script.run.processForm（document.forms [0]）;
}
< / script>
< / html>
也许我的整个方法都是错误的。但是我想要做的是在Google的PropertiesService中存储用户选项（可能想要更改userProperties到documentProperties，以使设置文档特定），然后在侧栏中按下提交按钮时保存这些值。下一次打开边栏时，应显示这些保存的设置。
您处于正确的轨道上。因为您已经将该变量传递给HtmlTemplate对象，所以剩下的唯一步骤就是使用GAS模板引擎来渲染它。
.GS文件
...
htmlTemplate.timehtml = time;
...
HTML模板
< input type =textname =timeid =timevalue =<？！= timehtml？>>
更多关于GAS中的模板化HTML https://developers.google.com/apps-script/guides/html/templates
代码不起作用的原因是您要通过设置HtmlTemplate对象的属性来传递变量。 HtmlTemplate和HtmlOutput对象仅存在于GAS Script Editor运行时的上下文中。您的浏览器最终会获取HTML字符串，然后将其解析为DOM元素并呈现。
在该阶段，任何与GAS相关的上下文都会丢失，您的本地安装的浏览器软件是您的代码的新运行时环境。这就是为什么你不能引用'timehtml'变量的原因。
I have been looking at various other solutions posted here but none of them seem to work for me.
I'm trying to pass a variable from my google script (which is originally stored in google's PropertiesService) to my html, because I want to use previously saved data as values for my text input box (showing the previously saved data).
This is my gs file (minus unrelated parts):
function openSettings() {
var htmlTemplate = HtmlService.createTemplateFromFile('settingsForm')
var userProperties = PropertiesService.getUserProperties();
var time = userProperties.getProperty('selectedTime');
htmlTemplate.timehtml = time;
var html = htmlTemplate.evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setTitle('Settings')
.setWidth(300)
SpreadsheetApp.getUi()
.showSidebar(html);
return html
}
function processForm(form) {
var userProperties = PropertiesService.getUserProperties();
var time = userProperties.getProperty('selectedTime');
time = form.time;
userProperties.setProperty('selectedTime', time);
}
And this is my html file (left out other unrelated parts):
<!DOCTYPE html>
<html>
<div>
<form>
<input type="text" name="time" id="time" style="width: 40px;">
<br><br><input type="button" class="action" onClick="writeFormData();
alert('submitted')" value="Submit"/>
</form>
</div>
<script>
var timeInput = document.getElementById("time");
var timehtml = time;
timeInput.value = timehtml;
</script>
<script type="text/javascript">
function writeFormData() {
google.script.run.processForm(document.forms[0]);
}
</script>
</html>
Perhaps my whole approach is wrong. But what I'm trying to do is store the user choices (might want to change userProperties to documentProperties, to make the settings document specific) in Google's PropertiesService and then save these values when the submit buttons is pressed in a sidebar. Next time when the sidebar is opened these saved settings should be shown.
You are on the right track. Because you've already passed the variable to the HtmlTemplate object, the only remaining step is to use GAS template engine to render it.
.GS file
...
htmlTemplate.timehtml = time;
...
HTML template
<input type="text" name="time" id="time" value="<?!= timehtml ?>">
More on templated HTML in GAS here https://developers.google.com/apps-script/guides/html/templates
The reason your code doesn't work is that you are passing the variable by setting the property of the HtmlTemplate object. HtmlTemplate and HtmlOutput objects exist only in the context of GAS Script Editor runtime. Your browser ends up getting the HTML string which it then parses into DOM elements and renders. At that stage, any GAS-related context is lost, with your locally installed browser software being the new runtime environment for your code. That's the reason why you can't reference the 'timehtml' variable.
这篇关于将google脚本值传递给html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
