[英]Reading data in Google Sheets and passing data to custom dropdown menu
I have a custom Dropdown menu in Google Sheets.我在 Google 表格中有一个自定义下拉菜单。 I'd like to pass information from a sheet into the dropdown.我想将信息从工作表传递到下拉列表中。 (see the screenshot for data) (数据见截图)
After updating my code thanks to @Cooper, and running the displayDropdown function, I am successfully logging the data.感谢@Cooper 更新我的代码并运行 displayDropdown 函数后,我成功记录了数据。 So it IS reading the data... But, it is not being populated in the dropdown.所以它正在读取数据......但是,它没有在下拉列表中填充。 What (obvious) step am I missing here?!我在这里错过了什么(明显的)步骤?!
myDropdown.html : 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>
Code.gs :代码.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;
I didn't use a templated approach.我没有使用模板化方法。 This is what my html for the just the select tag would look like and it included the resources for jQuery.这就是我的仅选择标签的 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>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.