使用 html 对话框中输入字段的值使用 Google Apps 脚本在 code.gs 中进行 var
[英]use value from input field in html dialog box to var in code.gs using Google Apps Script
问题描述
I have a dialog box where user can select a year.
我有一个对话框，用户可以在其中一年 select。 Then I want the server to process the selected value in the function doSomethingWithCompetitionYear(theYear).然后我希望服务器处理 function doSomethingWithCompetitionYear(theYear) 中的选定值。
Looked at several discussions, but can't get it working.看了几个讨论，但无法正常工作。 Looks like I need to do something with.withSuccesHandler().看起来我需要用.withSuccesHandler() 做点什么。
Code.gs代码.gs
function fncOpenMyDialog() {
//Open a dialog
var htmlDlg = HtmlService.createTemplateFromFile('DropDown_NewCompetitionFile');
thisYear = new Date();
htmlDlg.thisYear = thisYear.getFullYear();
htmlDlg.nextYear = htmlDlg.thisYear + 1;
htmlDlg = htmlDlg.evaluate()
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setWidth(200)
.setHeight(150);
SpreadsheetApp.getUi()
.showModalDialog(htmlDlg, 'Make selection');
};
function doSomethingWithCompetitionYear(theYear) {
var ui = SpreadsheetApp.getUi();
ui.alert(theYear);
}
HTML doc HTML 文档
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
Year
<select name="Competition_year" id="Competition_year" type="integer">
<option value=<?= thisYear?>><?= thisYear?></option>
<option value="nextYear"><?= nextYear?></option>
</select>
<hr/>
<button onmouseup="closeDia()">Submit</button>
<script>
var theYear = document.getElementById("Competition_year").value;
google.script.run.doSomethingWithCompetitionYear();
window.closeDia = function() {
google.script.host.close();
};
</script>
</body>
</html>
2 个解决方案
解决方案1
0 2020-04-29 20:47:10
Here's a simple boiler plate for doing something with.withSuccessHandler这是一个简单的样板，用于使用.withSuccessHandler 做一些事情
I added some JQuery, a msgdiv, withSuccessHandler() and a doSomethingWithCompetitionYear() server function.我添加了一些 JQuery、一个 msgdiv、withSuccessHandler() 和一个 doSomethingWithCompetitionYear() 服务器 function。
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
Year
<select name="Competition_year" id="Competition_year" type="integer">
<option value=<?= thisYear?>><?= thisYear?></option>
<option value="nextYear"><?= nextYear?></option>
</select>
<hr/>
<button onmouseup="closeDia()">Submit</button>
<div id="msgdiv"></div>
<script>
var theYear = document.getElementById("Competition_year").value;
google.script.run
.withSuccessHandler(function(msg){
document.getElementById("msgdiv").innerHTML=msg;
}))
.doSomethingWithCompetitionYear();
window.closeDia = function() {
google.script.host.close({year:$("#competition_year").val()});
};
</script>
</body>
</html>
code.gs:代码.gs：
function doSomethingWithCompetitionYear(obj) {
return Utilities.formatString('I did something with this year: %s',obj.year);
}
解决方案2
0 2020-04-30 08:05:25
Situation:情况：
If I understand you correctly you have a dialog box with two options, and you want to pass information on the selected option (in this case, 2020 or 2021 ) to the server-side function doSomethingWithCompetitionYear();如果我理解正确，您有一个包含两个选项的对话框，并且您希望将有关所选选项（在本例中为2020或2021 ）的信息传递给服务器端 function doSomethingWithCompetitionYear(); when the Submit button is clicked.单击Submit按钮时。
Issues:问题：
If that's the case, you don't actually need a success handler.如果是这种情况，您实际上并不需要成功处理程序。 You just need to pass the selected value as a parameter of doSomethingWithCompetitionYear(theYear);您只需将选定的值作为doSomethingWithCompetitionYear(theYear); . .
Also, if you want this to happen when the Submit button is clicked.此外，如果您希望在单击Submit按钮时发生这种情况。 You should add this to the closeDia function.您应该将此添加到closeDia function。 Otherwise, doSomethingWithCompetitionYear();否则， doSomethingWithCompetitionYear(); will run before submission.将在提交之前运行。
Finally, if you want to pass the next year ( 2021 ), and not the string "nextYear", you'll have to usescriplets on the element's value.最后，如果您想通过下一年（ 2021 ），而不是字符串“nextYear”，则必须对元素的值使用scriplets 。
Modification 1. Next year value:修改 1. 明年值：
Replace this:替换这个：
<option value="nextYear"><?= nextYear?></option>
For this:为了这：
<option value=<?= nextYear?>><?= nextYear?></option>
Modification 2. Calling server-side function when button is clicked:修改2.点击按钮时调用服务器端function：
Replace this:替换这个：
<script>
var theYear = document.getElementById("Competition_year").value;
google.script.run.doSomethingWithCompetitionYear();
window.closeDia = function() {
google.script.host.close();
};
</script>
For this:为了这：
<script>
window.closeDia = function() {
var theYear = document.getElementById("Competition_year").value;
google.script.run.doSomethingWithCompetitionYear(theYear); // theYear parameter has to be passed to server-side function
google.script.host.close();
};
</script>
Note:笔记：
- If you want to use information coming from
doSomethingWithCompetitionYear(theYear);如果您想使用来自doSomethingWithCompetitionYear(theYear);的信息in the client-side, you should use a success handler, which can call a client-side function that will get this data as a parameter (the server-side function, called bygoogle.script.rundoesn't return anything by itself, it needs a callback function).在客户端，您应该使用成功处理程序，它可以调用客户端 function，它将获取此数据作为参数（由 google.script.run 调用的服务器端google.script.run本身不会返回任何内容，它需要一个回调函数）。 It would be something like this:它会是这样的：
google.script.run.withSuccessHandler(yourClientSideFunction).doSomethingWithCompetitionYear(theYear);
Reference:参考：
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.