如何通过单个Google表单获取多个行条目?

时间:2019-04-05 11:33:51

标签: google-apps-script

我需要设计一个库存管理表格,该人员将在其中输入进出仓库的库存。由于在单个时间点,从仓库交换了不同数量的多种类型的产品(SKU)。因此,目前在Google表单中,我只能在后端工作表中输入一个条目。我想制作一个表单,用户可以在表单中添加多个SKU数据及其各自的数量,这样Google表单的后端工作表中的每个行都会有不同的行。有人可以指导我如何直接或通过Google Apps脚本完成该操作。

1 个答案:

答案 0 :(得分:0)

这是创建表然后将结果提交到Google Spreadsheet的简单示例。您需要查看这些Google链接。我的示例从“电子表格”菜单选项运行,但可以从Web应用程序轻松运行。

https://developers.google.com/apps-script/guides/html/

https://developers.google.com/apps-script/guides/html/reference/run

Code.gs

function test() {
  try {
    var html = HtmlService.createTemplateFromFile("HTML_Table").evaluate();
    SpreadsheetApp.getUi().showModelessDialog(html, "Table");
  }
  catch(err) {
    Logger.log(err);
  }
}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
}

function addRows(values) {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1");
  sheet.getRange(sheet.getLastRow()+1,1,values.length,values[0].length).setValues(values);
}

HTML_Table.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <?!= include('CSS_Table'); ?>    
  </head>
  <body>
    <table id="tableRows">
      <thead>
        <tr>
          <th>SKU</th>
          <th>Description</th>
          <th>Quantify</th>
          <th>Price</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
        </tr>
        <tr>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
        </tr>
        <tr>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
        </tr>
        <tr>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
        </tr>
        <tr>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
          <td><input class="inputCell" type="text"></td>
        </tr>
      <tbody>
    </table>
    <div class="buttonBar">
      <input class="inputButton" type="button" value="Submit" onclick="buttonClick(this)">
      <input class="inputButton" type="button" value="Cancel" onclick="buttonClick(this)">
    </div>
    <?!= include('JS_Table'); ?>    
  </body>
</html>

JS_Table.html

<script>
  function buttonClick(button) {
    if( button.value === "Submit" ) {
      var values = [];
      var table = document.getElementById("tableRows");
      for( var i=1; i<table.rows.length; i++ ) {
        values.push([]);
        var row = table.rows[i];
        for( var j=0; j<row.cells.length; j++ ) {
          var cell = row.cells[j].firstChild.value;
          values[i-1].push(cell);
        }
      }
      google.script.run.addRows(values);
      google.script.host.close();
    }
    else {
      if( confirm("Exit without saving?") ) google.script.host.close();
    }
  }
</script>

CSS_Table.html

<style>
  .inputCell { float: left; width: 110px; }
  .inputButton { float: left; width: 50%; }
</style>