Javascript 如何将自定义表单多行发送到google工作表？_Javascript_Forms_Loops_Google Sheets_Google Sheets Api

Javascript 如何将自定义表单多行发送到google工作表？

javascript forms loops google-sheets

Javascript 如何将自定义表单多行发送到google工作表？,javascript,forms,loops,google-sheets,google-sheets-api,Javascript,Forms,Loops,Google Sheets,Google Sheets Api,我想允许用户提交一个发送到我们的Google Spreadhseet的自定义表单。问题是，我想允许用户提交一个表单，该表单将附加到Google电子表格中的多行我现在的代码允许用户发送一个表单，该表单将附加到google表单中一次。如果我试图复制这些字段，并让用户发送两行，谷歌工作表只捕获第一行，而不是两行谷歌电子表格 |field_1|field_2|field_3|field_4| Row 1| | | | | Row 2|

我想允许用户提交一个发送到我们的Google Spreadhseet的自定义表单。问题是，我想允许用户提交一个表单，该表单将附加到Google电子表格中的多行

我现在的代码允许用户发送一个表单，该表单将附加到google表单中一次。如果我试图复制这些字段，并让用户发送两行，谷歌工作表只捕获第一行，而不是两行

谷歌电子表格

     |field_1|field_2|field_3|field_4|
Row 1|       |       |       |       |
Row 2|       |       |       |       |

HTML格式

<form id="test-form">
        <!-- ROW -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>

        <!-- ROW 2 -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>
        <div>
            <button type="submit" id="submit-form">Submit</button>
        </div>
    </form>

代码.gs

    function doGet(e){
    return handleResponse(e);
    }

    var SHEET_NAME = "Sheet1";

    var SCRIPT_PROP = PropertiesService.getScriptProperties(); 

    function doPost(e){
    return handleResponse(e);
    }

    function handleResponse(e) {
    var lock = LockService.getPublicLock();
    lock.waitLock(30000);  // wait 30 seconds before conceding defeat.

    try {
    var doc = SpreadsheetApp.openById(SCRIPT_PROP.getProperty("key"));
    var sheet = doc.getSheetByName(SHEET_NAME);
    var headRow = e.parameter.header_row || 1;
    var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0];
    var nextRow = sheet.getLastRow()+1; // get next row
    var row = []; 

    sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);

    return ContentService
          .createTextOutput(JSON.stringify({"result":"success", "row": nextRow}))
          .setMimeType(ContentService.MimeType.JSON);
    } catch(e){
    // if error return this
    return ContentService
          .createTextOutput(JSON.stringify({"result":"error", "error": e}))
          .setMimeType(ContentService.MimeType.JSON);
    } finally { //release lock
    lock.releaseLock();
    }
    }
    function setup() {
    var doc = SpreadsheetApp.getActiveSpreadsheet();
    SCRIPT_PROP.setProperty("key", doc.getId());
}

我无法复制您的代码，但我建议您复制

通过调用替换jquery代码并按如下方式修改您的代码：

代码.gs

 function doGet(e){
    return HtmlService.createHtmlOutputFromFile('index');  
    }

 var SHEET_NAME = "Sheet1";
 var SCRIPT_PROP = PropertiesService.getScriptProperties(); 

 function handleResponse(row1,row2) {
     var doc = SpreadsheetApp.openById(SCRIPT_PROP.getProperty("key"));
     var sheet = doc.getSheetByName(SHEET_NAME); 
     sheet.appendRow(row1);
     sheet.appendRow(row2);
    }
    function setup() {
    var doc = SpreadsheetApp.getActiveSpreadsheet();
    SCRIPT_PROP.setProperty("key", doc.getId());
}

index.html

<html>
  <head>
    <base target="_top">
  </head>
  <body>
 <form id="test-form">
        <!-- ROW -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>

        <!-- ROW 2 -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>
        <div>
            <button type="submit" id="submit-form" onclick="myJSFunction()">Submit</button>
        </div>
    </form>

  <script> 
 function myJSFunction(){
 var row1=[];
   row1.push(document.getElementsByName("field_1")[0].value);
   row1.push(document.getElementsByName("field_2")[0].value);
   row1.push(document.getElementsByName("field_3")[0].value);
   row1.push(document.getElementsByName("field_4")[0].value);
  var row2=[];
   row2.push(document.getElementsByName("field_1")[1].value);
   row2.push(document.getElementsByName("field_2")[1].value);
   row2.push(document.getElementsByName("field_3")[1].value);
   row2.push(document.getElementsByName("field_4")[1].value);
   google.script.run.handleResponse(row1,row2);
 }
</script> 
  </body>
</html>


字段1
字段2
字段3
字段4
字段1
字段2
字段3
字段4
提交
函数myJSFunction（）{
var row1=[]；
行1.push（document.getElementsByName（“字段1”）[0].value）；
行1.push（document.getElementsByName（“字段2”）[0].value）；
行1.push（document.getElementsByName（“字段3”）[0].value）；
行1.push（document.getElementsByName（“字段4”）[0].value）；
var row2=[]；
行2.push（document.getElementsByName（“字段1”）[1].value）；
row2.push（document.getElementsByName（“field_2”）[1].value）；
行2.push（document.getElementsByName（“字段3”）[1].value）；
行2.push（document.getElementsByName（“字段4”）[1].value）；
google.script.run.handleResponse（第1行，第2行）；
}

我认为您的代码不完整。如何从doGet（）函数调用html表单，以及将jquery代码嵌入到何处？@ziganotschka jquery代码被添加到表单所在的index.html文件中，我刚刚将其破解。在doGet（）上不确定。这段代码有效，但当我在表单中有多行时，它就不起作用了。

<html>
  <head>
    <base target="_top">
  </head>
  <body>
 <form id="test-form">
        <!-- ROW -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>

        <!-- ROW 2 -->
        <div>
            <label>Field 1</label>
            <input type="text" name="field_1" placeholder="Field 1" />
        </div>

        <div>
            <label>Field 2</label>
            <input type="text" name="field_2" placeholder="Field 2" />
        </div>

        <div>
            <label>Field 3</label>
            <input type="text" name="field_3" placeholder="Field 3" />
        </div>

        <div>
            <label>Field 4</label>
            <input type="text" name="field_4" placeholder="Field 4" />
        </div>
        <div>
            <button type="submit" id="submit-form" onclick="myJSFunction()">Submit</button>
        </div>
    </form>

  <script> 
 function myJSFunction(){
 var row1=[];
   row1.push(document.getElementsByName("field_1")[0].value);
   row1.push(document.getElementsByName("field_2")[0].value);
   row1.push(document.getElementsByName("field_3")[0].value);
   row1.push(document.getElementsByName("field_4")[0].value);
  var row2=[];
   row2.push(document.getElementsByName("field_1")[1].value);
   row2.push(document.getElementsByName("field_2")[1].value);
   row2.push(document.getElementsByName("field_3")[1].value);
   row2.push(document.getElementsByName("field_4")[1].value);
   google.script.run.handleResponse(row1,row2);
 }
</script> 
  </body>
</html>