我在 Google 表格中有一个自定义下拉菜单。我想将信息从工作表传递到下拉列表中。 (数据见截图)
在@Cooper更新我的代码并运行displayDropdown函数后，我成功记录了数据。所以它正在读取数据...但是，它没有被填充在下拉列表中。 我在这里错过了什么(明显的)步骤？!
myDropdown.html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<form>
<div class="select-style">
<select id="dropJob">
<?!= getDays(); ?>
</select>
</div>
</form>
</body>
</html>
代码.gs:
function displayDropdown()
{
var htmlDlg = HtmlService.createHtmlOutputFromFile('myDropdown')
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.setWidth(350)
.setHeight(250);
SpreadsheetApp.getUi()
.showModalDialog(htmlDlg, "title");
return HtmlService.createTemplateFromFile('myDropdown').evaluate();
}
function getDays()
{
var ui = SpreadsheetApp.getUi();
var active = SpreadsheetApp.getActive();
var sheet = active.getSheetByName("Days");
var myRange = sheet.getRange("A1:A7");
var data = myRange.getValues();
var optionsHTML = "";
for (var i = 0; i < data.length; i++) {
optionsHTML += '<option>' + data[i][0] + '</option>';
};
Logger.log(optionsHTML);
return optionsHTML;
最佳答案
我没有使用模板化方法。这就是我的 select 标签的 html 的样子，它包含 jQuery 的资源。
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.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>
<script>
$(function() {//this function runs after the DOM loads which goes and get the dropdown stuff from a spreadsheet and returns it to the .withSuccessHandler(updateSelect) which then calls updateSelect and pass the data array to updateSelect.
$('#txt1').val('');
google.script.run
.withSuccessHandler(updateSelect)
.getSelectOptions();
});
function updateSelect(vA) {//this is where the dropdown gets loaded
var select = document.getElementById("sel1");//sel1 is the id of the select tag
select.options.length = 0;
for(var i=0;i<vA.length;i++)
{
select.options[i] = new Option(vA[i],vA[i]);
}
}
</script>
</head>
<body>
<select id="sel1" class="control" style="width:255px;height:35px;margin:10px 0 10px 0;">
<option value="" selected></option>
</select>
</body>
</html>
关于javascript - 读取 Google Sheets 中的数据并将数据传递到自定义下拉菜单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57928739/