我目前正在Google脚本中实现表单。不幸的是,我正在努力通过单击html按钮来获得一个调用的函数。这里看起来如何:
单击“提交”后,我想调用一个函数以将参数传递给要处理的服务器。为此,我在html部分上实现了form_data()函数。代码看起来像这样:
。gs文件(节选):
function showPrompt() {
var ui = SpreadsheetApp.getUi();
var result = ui.prompt(
'Please enter the Problem ID: ',
ui.ButtonSet.OK_CANCEL);
// Process the user's response.
var button = result.getSelectedButton();
var rfsId = result.getResponseText();
if (button == ui.Button.OK) {
this.radiosOnADialog();
//getData(rfsId);
} else if (button == ui.Button.CANCEL) {
} else if (button == ui.Button.CLOSE) {
}
}
function radiosOnADialog() {
var ui = SpreadsheetApp.getUi();
console.log('Hello World');
Logger.log('Hi');
//Call the HTML file and set the width and height
var html = HtmlService.createHtmlOutputFromFile("testUI")
.setWidth(200)
.setHeight(150);
//Display the dialog
var dialog = ui.showModalDialog(html, "Select Output Language");
}
function runsies(values){
//Display the values submitted from the dialog box in the Logger.
Logger.log(values);
};
。html文件:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
</head>
<body>
<div>
<table>
<col width="80">
<col width="50">
<tr>
<th><strong>Language</strong></th>
<th><strong></strong></th>
</tr>
<tr>
<td>English </td>
<td><input type="radio" name="english" value="en"></td>
</tr>
<tr>
<td>German </td>
<td><input type="radio" name="german" value="de"></td>
</tr>
</table>
<button onclick="form_data()"> Submit </button>
<button onclick="google.script.host.close()"> Close </button>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
function form_data(){
Logger.log("Values are:");
var values = [{
"english":$("input[name=english]:checked").val(),
"german":$("input[name=german]:checked").val(),
}];
google.script.run.withSuccessHandler(closeIt()).runsies(values);
};
function closeIt(){
google.script.host.close()
};
</script>
</body>
</html>
您在form_data
函数中缺少引号。
之前:
function form_data(){
Logger.log("Values are:");
var values = [{
"english":$("input[name=english]:checked").val(),
"german":$("input[name=german]:checked").val(),
}];
google.script.run.withSuccessHandler(closeIt()).runsies(values);
};
之后:
function form_data(){
Logger.log("Values are:");
var values = [{
"english":$("input[name='english']:checked").val(),
"german":$("input[name='german']:checked").val(),
}];
google.script.run.withSuccessHandler(closeIt()).runsies(values);
};
注意此处添加的单引号:
"english":$("input[name='english']:checked").val(),
还有这里:
"german":$("input[name='german']:checked").val(),
通过删除和在按钮上添加ID,将代码更改为此。现在,该按钮关闭了模式窗口,但是仍然无法正确调用功能...
<td>German </td>
<td><input type="radio" name="german" value="de"></td>
</tr>
</table>
<button id='submit' onclick='form_data();'> Submit </button>
<button id='close 'onclick='google.script.host.close();'> Close </button>
<!--</div>-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
function form_data(){
var values = [{
"english":$("input[name='english']:checked").val(),
"german":$("input[name='german']:checked").val(),
}];
google.script.run.withSuccessHandler(closeIt()).runsies(values);
};
function closeIt(){
console.log('Close');
google.script.host.close()
};
</script>
</body>
</html>