我正在尝试按照教程使用 Google 应用程序脚本构建网络应用程序。 我想要实现的是使用数据表将数据从 Google 工作表显示到 HTML 页面。 但似乎表格不会显示。
这是我的代码
代码.gs
function doGet(){
return HtmlService.createTemplateFromFile("dt").evaluate();
//return HtmlService.createHtmlOutputFromFile("datatables").evaluate();
}
function getSpreadsheetData() {
const ss = SpreadsheetApp.openById("1739b8z8pd8_viicRiWxNhb3j2UIRtYSs9TWOB5D72Bg"); //ss = spreadsheet
const ws = ss.getSheetByName("database_edited"); //ws = working sheet
//const firstCell = ws.getRange("A1");
//const dataRange = firstCell.getDataRegion();
const dataRange = ws.getRange("A:F")
const data = dataRange.getDisplayValues();
const headersArray = data.shift();
const headersObject = headersArray.map(header => {return {title:header}});
//console.log(data);
//console.log(headersObject);
return{data: data, headers: headersObject};
dt.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet">
</head>
<body>
<h1 id="tes"></h1>
<table id="tabelpenduduk" class="display" width="100%"></table>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.js"></script>
<script type="text/javascript" src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script>
function dispData(dataSet) {
$(document).ready(function() {
$('#tabelpenduduk').DataTable( {
data: dataSet.data,
columns: dataSet.headers
} );
} );
}
google.script.run.withSuccessHandler(dispData).getSpreadsheetData();
</script>
</body>
</html>
使用数据表将 Google 表格中的数据显示到 HTML 页面。