我的HTML表格有问题。我希望我的电子表格数据显示在此处。我不知道我错过了什么。
这是我的Code.GS:
function getTableData(){
var url3 = "https://docs.google.com/spreadsheets/d/xxxxxxxxxx/edit#gid=0";
var ss3 = SpreadsheetApp.openByUrl(url3);
var ws3 = ss3.getSheetByName("Time");
var data = ws3.getRange(2,2,ws3.getLastRow()-1,10).getValues();
//Logger.log(data);
return data;
}
这是我的脚本:
<script>
var data = [
[1, "Jack",55],
[1, "Jack",55],
[1, "Jack",55]
];
document.addEventListener("DOMContentLoaded", function(){
google.script.run.withSuccessHandler(generateTable).getTableData();
});
function generateTable(dataArray){
var tbody = document.getElementById("table-body");
dataArray.forEach(function(r){
var row = document.createElement("tr");
var col1 = document.createElement("td");
col1.textContent = r[0];
var col2 = document.createElement("td");
col2.textContent = r[1];
var col3 = document.createElement("td");
col3.textContent = r[2];
row.appendChild(col1);
row.appendChild(col2);
row.appendChild(col3);
tbody.appendChild(row);
});
}
</script>
HTML:
<table>
<thead>
<tr>
<th>E-mail</th>
<th>Case</th>
<th>Assignment</th>
<th>Notes</th>
<th>Start Date</th>
<th>Start Time</th>
<th>End Date</th>
<th>End Time</th>
<th>Total</th>
</tr>
</thead>
<tbody id="table-body">
</tbody>
</table>
我差点扯掉头发,感到沮丧。我尽我所能,但没有运气。你能帮我吗?
答案 0 :(得分:0)
这是我用来获取所有电子表格的旧代码。起初需要一段时间才能加载所有电子表格,因此有机会运行它。它还允许您编辑所有图纸。我猜您将能够弄清楚如何使用此示例来解决问题。
htmlss.hmtl:
<!DOCTYPE html>
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
$(function() {
$('#msg').html('Please wait. Collecting a list of all Spreadsheets...');
google.script.run
.withSuccessHandler(updateSelect)
.getAllSpreadSheets();
});
function updateSS(i,j)
{
var str='#txt' + String(i) + String(j);
var value=$(str).val();
var ssId=$('#sel1').val();
var name=$('#sel2').val();
var updObj={rowIndex:i,colIndex:j,value:value,id:ssId,name:name};
$(str).css('background-color','#ffff00');
google.script.run
.withSuccessHandler(updateSheet)
.updateSpreadsheet(updObj);
}
function updateSheet(data)
{
//$('#success').text(data.message);
$('#txt' + data.ridx + data.cidx).css('background-color','#ffffff');
}
function updateSelect(dtO)
{
$('#sel1').css('background','#ffffff');
$('#sel2').css('background','#ffffff');
$('#msg').html('Spreadsheet List has been updated. Now select a SpreadSheet to display');
var select = document.getElementById(dtO.type);
var vA=dtO.array;
select.options.length = 0;
for(var i=0;i<vA.length;i++)
{
select.options[i] = new Option(vA[i][0],vA[i][vA[i].length-1]);
}
}
function loadSelectSheet()
{
var shId=$('#sel1').val();
var name=$('#sel1').text();
$('#sel1').css('background','#ffff00');
document.getElementById('ssname').innerHTML="";
var ssO={name:name ,id:shId}
google.script.run
.withSuccessHandler(updateSelect)
.getAllSheets(ssO);
}
function displaySelectedSheet()
{
var ssId=$('#sel1').val();
var name=$('#sel2').val();
$('#sel2').css('background','#ffff00');
document.getElementById('shname').innerHTML="";
var ssO={id:ssId,name:name};
google.script.run
.withSuccessHandler(displaySheet)
.htmlSpreadsheet(ssO);
}
function displaySheet(opO)
{
$('#sel2').css('background','#ffffff');
document.getElementById('ssname').innerHTML=opO.name;
document.getElementById('shname').innerHTML=opO.shname;
document.getElementById('sss').innerHTML=opO.hl;
}
console.log('My Code');
</script>
<style>
th{text-align:left}
</style>
</head>
<body>
<div id="msg"></div><br />
<br /><select id="sel1" onChange="loadSelectSheet();"></select>
<br /><select id="sel2" onChange="displaySelectedSheet();"></select>
<div id="ssname"></div>
<div id="shname"></div>
<div id="sss"></div>
</body>
</html>
Code.gs:
function htmlSpreadsheet(ssO) {
var br='<br />';
var s='';
var hdrRows=1;
var ss=SpreadsheetApp.openById(ssO.id);
var sht=ss.getSheetByName(ssO.name);
var rng=sht.getDataRange();
var rngA=rng.getValues();
s+='<table>';
for(var i=0;i<rngA.length;i++)
{
s+='<tr>';
for(var j=0;j<rngA[i].length;j++)
{
if(i<hdrRows)
{
s+='<th id="cell' + i + j + '">' + '<input id="txt' + i + j + '" type="text" value="' + rngA[i][j] + '" size="20" onChange="updateSS(' + i + ',' + j + ');" />' + '</th>';
}
else
{
s+='<td id="cell' + i + j + '">' + '<input id="txt' + i + j + '" type="text" value="' + rngA[i][j] + '" size="20" onChange="updateSS(' + i + ',' + j + ');" />' + '</th>';
}
}
s+='</tr>';
}
s+='</table>';
s+='</body></html>';
var namehl=Utilities.formatString('<h1>%s</h1>', ss.getName());
var shnamehl=Utilities.formatString('<h2>%s</h2>', sht.getName());
var opO={hl:s,name:namehl,shname:shnamehl};
return opO;
}
function updateSpreadsheet(updObj) {
var i=updObj.rowIndex;
var j=updObj.colIndex;
var value=updObj.value;
var ss=SpreadsheetApp.openById(updObj.id);
var sht=ss.getSheetByName(updObj.name);
var rng=sht.getDataRange();
var rngA=rng.getValues();
rngA[i][j]=value;
rng.setValues(rngA);
var data = {'message':'Cell[' + Number(i + 1) + '][' + Number(j + 1) + '] Has been updated', 'ridx': i, 'cidx': j};
return data;
}
function doGet() {
var userInterface=HtmlService.createHtmlOutputFromFile('htmlss').setWidth(1000).setHeight(450);
return userInterface.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
function getAllSpreadSheets() {
var files=DriveApp.getFilesByType(MimeType.GOOGLE_SHEETS);
var s = '';
var vA=[['Select Spreadsheet',0]];
while(files.hasNext())
{
var file = files.next();
var fileName=file.getName();
var fileId=file.getId();
vA.push([fileName,fileId]);
}
//return vA;
return {array:vA,type:'sel1'};
}
//working on this function right now 2017/11/08
function getAllSheets(ssO) {
var ss=SpreadsheetApp.openById(ssO.id);
var allSheets=ss.getSheets();
var vA=[['Select Sheet']];
for(var i=0;i<allSheets.length;i++)
{
var name=allSheets[i].getName();
vA.push([name]);
}
return {array:vA,type:'sel2'};
}