如何在Google中填充HTML服务选择选项？
如何在Google中填充HTML服务选择选项？
提问于 2018-03-30 15:53:41
我正在尝试填充我的HTML服务下拉/选择选项列表，其中包含在我正在使用的Google的供应商数据库选项卡A列中的所有条目。但是，在运行时，它目前显示为空白。有什么建议吗？
应用程序脚本：
function getVendors() {
var active = SpreadsheetApp.getActive();
var sheet = active.getSheetByName("Vendor Database");
var lastRow = sheet.getLastRow();
var myRange = sheet.getRange("A2:A" + lastRow);
var data = myRange.getValues();
var optionsHTML += "";
for (var i = 0; i < data.length;i+=1) {
optionsHTML = '<option>' + data[i][0] + '</option>';
};
return optionsHTML;
}HTML：
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form>
<div>
<select>
<option> != google.script.run.getVendors(); </option>
</select>
</div>
</form>
</body>
</html>回答 2
Stack Overflow用户
回答已采纳
发布于 2018-03-31 03:55:58
初始化optionsHTML时，应该是直接赋值，而不是+=。相反，在for循环中使用+=，否则您将替换optionsHTML的内容，而不是附加到它。
function getVendors() {
var active = SpreadsheetApp.getActive();
var sheet = active.getSheetByName("Vendor Database");
var lastRow = sheet.getLastRow();
var myRange = sheet.getRange("A2:A" + lastRow);
var data = myRange.getValues();
var optionsHTML = "";
for (var i = 0; i < data.length; i+=1) {
optionsHTML += '<option>' + data[i][0] + '</option>';
};
return optionsHTML;
}确保您正在正确地评估HTML。由于设置它的方式，您需要将您的HTML文件(我假设它称为Index.html)作为模板处理。
function doGet() {
return HtmlService.createTemplateFromFile('Index').evaluate()
}最后，在HTML文件中，看起来您使用的是不完全锚点。应该是<?!= ... ?>，然后直接调用函数。(同时，删除周围的<option></option>标记，因为getVendors()已经提供了这些标记。)
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form>
<div>
<select>
<?!= getVendors(); ?>
</select>
</div>
</form>
</body>
</html>一旦你有了这样的工作，如果花更多的时间和精力在这上面有意义的话，那么就按照@Cooper提到的在HTML中使用客户端脚本来遵循最佳实践和异步加载数据，而不是在模板中加载数据。
Stack Overflow用户
发布于 2018-03-30 17:05:56
这是我过去做过的类似的事情。
以下是html文件中的Javascript：
$(function() {
$('#txt1').val('');
google.script.run
.withSuccessHandler(updateSelect)
.getSelectOptions();
});
function updateSelect(vA)
{
var select = document.getElementById("sel1");
select.options.length = 0;
for(var i=0;i<vA.length;i++)
{
select.options[i] = new Option(vA[i],vA[i]);
}
}下面是相关的HTML：
<select id="sel1" class="control" style="width:255px;height:35px;margin:10px 0 10px 0;">
<option value="" selected></option>
</select>下面是google脚本：
function getSelectOptions()
{
sortOptions();
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('Options');
var rg=sh.getDataRange();
var vA=rg.getValues();
var options=[];
for(var i=0;i<vA.length;i++)
{
options.push(vA[i][0]);
}
return vA;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/49577433
复制相关文章
相似问题
腾讯云开发者
