在 Apps Script 函数中获取 html 文本框的值 [英] Get value of html text box in Apps Script function
问题描述
这里出了点问题，我从其他有类似问题的人那里尝试过的所有建议似乎都不起作用.
Something is wrong here, and all the suggestions I've tried from others with similar questions don't seem to work.
我有两个文件:谷歌脚本中的 myPage.html 和 myCode.gs.我已将 html 文件部署为 Web 应用程序，并且我已经想出(在帮助下)如何为提交"按钮创建 onclick 事件以触发 myCode.gs 文件中的 emailTech 函数就好了.
I have two files: myPage.html and myCode.gs in google scripts. I have deployed the html file as a web app, and I have figured out (with help) how to make the onclick event for the 'submit' button to trigger the emailTech function from the myCode.gs file just fine.
现在我想将 html 文件中文本框中的值插入到从 onClick 事件调用的电子邮件中.我已经尝试过 document.getElementById('textBoxId').value，但我收到以下错误参考错误:文档"未定义.是什么给出的?
Now I want to insert the value from the text box in the html file into the email that is called from the onClick event. I have tried document.getElementById('textBoxId').value, but I get the following error "Reference Error: "document" is not defined. " What gives?
myPage.html 文件:
myPage.html file:
<html>
<head>
<title>Test Page</title>
</head>
<body>
<input type="button" onClick="google.script.run.emailTech();" value="Submit" />
<input type="text" value=" " id = "textBox" name = "textBox" />
</body>
<script type="text/javascript">
</script>
</html>
myCode.gs 文件:
myCode.gs file:
function doGet() {
return HtmlService.createHtmlOutputFromFile('myPage');
}
function emailTech(){
var nameBox = document.getElementById('textBox').value;
var message = "This is the text box value" + nameBox;
MailApp.sendEmail("123@xyz.com", "This is the subject", message );
}
推荐答案
错误消息是正确的 - 在您的 Apps 脚本函数 emailTech() 中，范围内没有名为 的变量文档.
The error message is correct - in your Apps Script function emailTech(), there is no variable in scope that's named document.
您有两种部署 Apps Script WebApps 的不同方式.由于您使用的是 HTML 服务(并且您的用户界面是一个 html 文件)，您不能使用 UI 服务方法(如 getElementById())来访问输入值.所以，你会做一些不同的事情.
You've got two different ways of deploying Apps Script WebApps mixed up. Since you're using the HTML Service (and your user interface is an html file), you can't use the UI Service methods (like getElementById()) to access input values. So, you'll do something different.
要将提交按钮和输入字段联系在一起，请使用包含在 标签中的表单.提交按钮仍然有一个 onclick 函数，但现在它将是一个嵌入在您的 HTML 中的 javascript 函数，它将把表单中的所有输入传递给您的 emailTech() 函数.
To tie the submit button and input field together, use a form, enclosed in <form> tags. The submit button will still have an onclick function, but now it will be a javascript function embedded in your HTML, which will pass all the input from the form to your emailTech() function.
在您的应用程序脚本端处理程序中，您将接收表单输入作为对象，表单中的字段作为键值对.关键是字段中的 name.
In your apps-script-side handler, you'll receive the form input as an Object, with the fields from the form as key-value pairs. The key is the name from the field.
此答案中描述了一般解决方案.这是一个适合您的代码的版本.我忽略了 Arun 展示的成功和失败处理.当然，在现实生活中部署之前，您应该先进行错误检查.
The general solution is described in this answer. Here's a version that fits your code. I've left out the success and failure handling that Arun shows. You should build in error checking before deploying this in real life, of course.
function doGet() {
return HtmlService.createHtmlOutputFromFile('myPage');
}
function emailTech(form){
var nameBox = form.techEmail;
var message = "This is the text box value" + nameBox;
MailApp.sendEmail("email@somewhere.com", "This is the subject", message );
}
myPage.html
<html>
<head>
<title>Test Page</title>
</head>
<body>
<form>
<input type="text" value=" " name="techEmail" />
<input type="button" onClick="formSubmit()" value="Submit" />
</form>
</body>
<script type="text/javascript">
function formSubmit() {
google.script.run.emailTech(document.forms[0]);
}
</script>
</html>
这篇关于在 Apps Script 函数中获取 html 文本框的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
