使用Google Apps脚本,我创建了一个HTML页面,其中的表单使用其输入来填充Google表格。这一切都很好,但我想现在使用一种不同的形式(取决于存在的数据)将动态创建表单中的字段。到目前为止我的代码:
HTML
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script>
// Prevent form from submitting
function preventFormSubmit() {
var forms = document.querySelectorAll('form');
for (var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', function(event) {
event.preventDefault();
});
}
}
window.addEventListener('load', preventFormSubmit);
function FormSubmit(formObject) {
google.script.run.withSuccessHandler(FormSuccess).EnterData(formObject);
}
function FormSuccess() {
var resets = document.getElementsByClassName("reset");
for (var i = 0; i < resets.length; i++) {
resets[i].value = "";
}
google.script.run.ProgramSuccess();
}
</script>
</head>
<body>
<form id="entryForm" onsubmit="FormSubmit(this)">
Name:<br>
<input type="text" name="name">
<br>
Client Name:<br>
<input class = "reset" type="text" name="clientName">
<br>
Task:<br>
<input class = "reset" type="text" name="task">
<br>
Hours:<br>
<input class = "reset" type="number" name="hours" min="0" step="0.01">
<br><br>
<input type="submit" value="Submit">
<input type="reset">
</form>
</body>
</html>
的JavaScript
function EnterData(fObject) {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sheet = ss.getSheetByName("Sheet1");
sheet.activate();
var lastRow = sheet.getLastRow();
var timestamp = Utilities.formatDate(new Date(), "GMT-5", "MM/dd/yyyy' 'HH:mm:ss");
var entries = [[timestamp, fObject.name, fObject.clientName, fObject.projectType, fObject.task, fObject.hours]];
var range = sheet.getRange(sheet.getLastRow()+1, 1, 1, 6);
if ((lastRow % 2) == 0) {
range.setValues(entries).setBackground("#d9d9d9");
}
else {
range.setValues(entries);
}
return;
}
function ProgramSuccess() {
var ss = SpreadsheetApp.getActiveSpreadsheet();
ss.toast("Data Entry Successful");
}
例如,是否可以将对象传递给包含表单标记及其选项/类的HTML,并让HTML根据该信息自动创建表单?
感谢所有帮助。