javascript - 将电子表格中的每个值返回到 Web 应用程序表

Question

我正在尝试做的事情:

1. 从电子表格中获取每个值(6 列，约 10 多行)

   • 我可以获得这些值。我可能会用 .getRange(row, column, sheet.getLastRow() - 1, 1).getValues(); 单独获取每一列。或者我可以使用 .getDataRange().getValues() 获取每个值然后就这样把它们放到表里？

   • 或者只使用 for 循环会更好吗？ -- 最底部的示例

2. 返回那些由 <table>, <tr>, <th>, <td> 包围的值 [作为模板化 HTML？]代码 - 下面的示例

3. 当名称获取时，在 Web 应用程序上显示包含值的表格 点击

   • 可以插入<table>代码开头为style="display: none;" ，然后当单击名称时，是否显示表格？或者将其放在一个不可见的 div 中，单击后可见？

 

表格示例:

<table>
 <tr>
  <th>header1</th>
  <th>header2</th>
  <th>header3</th>
  <th>header4</th>
  <th>header5</th>
  <th>header6</th>
 </tr>
 <tr>
  <td>value1</td>
  <td>value2</td>
  <td>value3</td>
  <td>value4</td>
  <td>value5</td>
  <td>value6</td>
 </tr>
 //etc
</table>

 

我不知道我想要做的事情是否算作模板化 HTML，或者使用模板化 Html 是否会更好...

我需要帮助的一件大事是返回表中的每个值并将其显示在网络应用程序上。

 

<小时/>

 

for循环示例

如果我执行 for 循环并返回列或行中的每个值

column1[i]  
column2[i]  
etc  

或

row1[i]  
row2[i]  
etc 

如何以表格形式返回这些值？

会是这样吗:

var x = "<tr>";
var y = row1[i];
var z = "</tr>";

return x + y + z

如果是这样，我如何用所有行/列值制作整个表格？

此外，一旦表格完全构建，我将如何使用 css 设置表格样式？我假设我仍然可以向表中添加一个 id 并从那里设置它的样式。

我不知道电子表格中的确切行数，因此最好进行动态设置 - 可能获取所有行而不是列，并对每行使用 for 循环？

如有任何帮助，我们将不胜感激。谢谢。

 

<小时/>

 

如果我想在表格中添加另一列(而不是在电子表格中)，我该如何做？我正在尝试向标题行添加一个添加行按钮，并在每行表数据的末尾添加一个删除行按钮。

另外，我知道您可以设置 <td>至<td contenteditable='true'> ...但是，如果数据只能在新添加的行上编辑，并且一旦提交值就无法编辑表格单元格，我该如何实现呢？ -- 我是否需要一个事件监听器或某种触发器来查看何时输入值并将该单元格触发到 contenteditable='false' ？

再次感谢。

Answer 1

您可以使用嵌套的 for 循环。

var range = SpreadsheetApp.getActiveSpreadsheet().getDataRange().getValues();
var isHeader = true;
var html = "<table>\n";
for (var i = 0; i < range.length; i++) {
  html += "<tr>\n";
  for (var j = 0; j < range[i].length; j++) {
    if (isHeader) {
      html += "<th>" + range[i][j] + "</th>\n";
    }
    else {
      html += "<td>" + range[i][j] + "</td>\n";
    }
  }
  isHeader = false;
  html += "</tr>\n";
}
html += "</table>";