我创建了一个表单,其中包含一组复选框,这些复选框从谷歌表格中的一列中填充。因此,如果列中的条目发生变化,表单复选框也会发生变化。
我的问题涉及获取选择和检索数据的方式。
单击表单上的提交按钮时,它会调用一个函数: google.script.run.test(document.forms[0])
我的测试函数使用 Logger.log() 将信息附加到工作表中的表格以及日志中。
document.forms[0] 的形式为:{=[Level 1, Level 2, Level 3, Level 4], name=test 4}
我的第一个问题是:
如何命名复选框组以便对象 document.forms[0] 中的数组 - 以便我可以使用 document.forms[0]["SOME-NAME"] 调用它?
现在我必须用 document.forms[0][""] 来调用它,这让我很不舒服。
我的第二个问题解释起来有点奇怪。 我发现如果填充来自 google 工作表的复选框的描述是两个词的描述 - 那么表单返回一个包含选择的数组。 例如。来自 Logger {=[Level 1, Level 2, Level 3, Level 4], name=test 4}
但是如果描述是单个单词,则表单将每个选择作为其自己的条目返回 例如。来自 Logger {name=test 6, Three=Three, One=One, Two=Two}
如何确保表单返回数组而不是单个选择?
我创建的用于测试和演示的表格在这里:
https://docs.google.com/spreadsheets/d/1vzg4VMgDbqz0ImCH_V5-1vF5qY0UHVGHK6JJfCVrADM/edit?usp=sharing
任何帮助将不胜感激!!
Html for the form :
<p><b>Testing check boxes and retrieving info</b> </p>
<hr>
<div>
<form>
<table>
<tr>
<td>Name: </td><td><input id="name" name="name" type ="text" /></td>
</tr>
<tr>
<td>Choices: </td>
<td><fieldset class="group" id="choices" name="choices" >
--CHANGE--
</fieldset></td>
</tr>
<tr>
<td>Submit Information: </td><td> <input onclick="formSubmit()" type="button" value="Submit" /></td>
</tr>
</table>
<hr>
<table>
<tr>
<td>Cancel Transaction: </td><td>
<input onclick="google.script.host.close()" type="button" value="Cancel" /></td>
</tr>
</table>
</form>
</div>
<script>
function formSubmit(){
google.script.run.test(document.forms[0]);
google.script.host.close();
}
</script>
Function in Code.gs that opens the form:
// Set up the checkbox list and update html code from html file and open form
function openForm(){
// get Classes to populate the check box list and create html string
var values = getClasses();
var html = ""
for(var i=1; i < values.length; i++){
html = html + '<input type="checkbox" label="classList" name="' + values[i][0] + '" value="' + values[i][0] + '"> '+values[i][0] + '<br>';
}
// replace place holder in html file with checkbox code
var f1 = HtmlService.createHtmlOutputFromFile('form1').getContent();
f1 = f1.replace("--CHANGE--",html);
// open spread sheet and then open form in sheets
var ss = SpreadsheetApp.getActiveSpreadsheet();
var f2 = HtmlService.createHtmlOutput(f1);
ss.show(f2);
}
Function that is called after submit button pressed:
// Get the info from the form and do something with it
function test(info){
Logger.log(info);
var classList = info[''];
if (Array.isArray(classList)){
classList = classList.toString();
}
var data = [info['name'], classList];
var ss = SpreadsheetApp.getActive().getSheetByName("Test");
ss.appendRow(data);
}
要获取作为数组传递的复选框选择,您需要在将数据传递到服务器之前使用自定义代码处理数据。我会通过标签名称获取所有元素。换句话说,获取所有输入元素。
<script>
function formSubmit(){
console.log('document.forms[0] ' + document.forms[0]);
var choicesElmt = document.getElementById("choices");
var allInputElements = choicesElmt.getElementsByTagName("input");
var isChecked=false,
arrayOfChecked=[],
thisElmt;
for (var key in allInputElements) {
console.log('key is: ' + key)
thisElmt = allInputElements[key];
console.log('thisElmt is: ' + thisElmt)
if (thisElmt!==undefined) {
isChecked = thisElmt.checked;
};
console.log('isChecked: ' + isChecked)
if (isChecked===true) {
arrayOfChecked.push(key);
};
};
console.log('arrayOfChecked: ' + arrayOfChecked);
google.script.run.test(arrayOfChecked);
//google.script.host.close();
}
</script>
现在您的代码动态地为每个复选框分配一个名称,该名称是电子表格的 ColumnA 中的值。 Apps 脚本会更改表单对象,而获取值的唯一方法是使用名称。如果输入中没有检查或值,则不会在表单对象中传递任何值。在服务器端,您不需要在对象上使用零索引。只需使用“点”和名称即可。
Logger.log('info.One: ' + info.One);
如果从未选中第二个复选框,则
info.Two
将未定义。
你可以在
.gs
服务器代码中循环遍历对象来查看对象中的所有内容:
for (var key in info) {
Logger.log('key is: ' + key)
Logger.log('value is: ' + info[key])
};
在玩@SandyGood 的代码时,我能够找到我自己问题的答案。
在为每个复选框创建 html 时添加此行:
<input type="checkbox" label="classList" name="checkList" value="' + values[i][0] + '">
如果您将名称字段设置为每个复选框的相同值,则选择将组合在一起作为一个数组。
这似乎规范了 document.Forms[0] 的行为——如果复选框的名称相同,则 document.Forms[0] 总是返回一个数组,而不管复选框的描述(一个词或两个词) .
我已经更新了谷歌表格中的代码....
我正在处理考勤表,但我需要很长时间才能将名单填写为复选框,
我如何修改您的代码以便能够在表单上填充组名称。
谢谢你的帮助