将数据发送到Google电子表格

时间:2018-10-20 12:17:10

标签: javascript google-apps-script web-applications google-sheets

我需要将表单数据发送到Google电子表格,因此我偶然发现了此链接 Submit an HTML Form to Google Sheets

一切正常。但是,当我更改工作表的名称时,它不会将数据发布到Google工作表中。我尝试了所有方法,例如创建一个新的工作表,使其处于活动状态,但根本不发布

var $form = $('form#test-form'),
    url = 'https://script.google.com/macros/s/AKfycbyJU26E5ugtv_McCJqih-MnpZgZX7tm1yoAmkYibGTpyiFTl1bf/exec'

$('#submit-form').on('click', function(e) {
  e.preventDefault();
  var jqxhr = $.ajax({
    url: url,
    method: "GET",
    dataType: "json",
    data: $form.serialize()
  }).success(
    // do something
  );
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="test-form">
  
  <div>
    <label>Field 1</label>
    <input type="text" name="form_field_1" placeholder="Field 1"/>
  </div>

  <div>
    <label>Field 2</label>
    <input type="text" name="form_field_2" placeholder="Field 2"/>
  </div>
  
  <div>
    <label>Field 3</label>
    <input type="text" name="form_field_3" placeholder="Field 3"/>
  </div>
  
  <div>
    <label>Field 4</label>
    <input type="text" name="form_field_4" placeholder="Field 4"/>
  </div>

  <div>
    <button type="submit"id="submit-form">Submit</button>
  </div>

</form>

2 个答案:

答案 0 :(得分:0)

// Usage
//  1. Enter sheet name where data is to be written below
        var SHEET_NAME = "Sheet1";

//  2. Run > setup
//
//  3. Publish > Deploy as web app 
//    - enter Project Version name and click 'Save New Version' 
//    - set security level and enable service (most likely execute as 'me' and access 'anyone, even anonymously) 
//
//  4. Copy the 'Current web app URL' and post this in your form/script action 
//
//  5. Insert column names on your destination sheet matching the parameter names of the data you are passing in (exactly matching case)

var SCRIPT_PROP = PropertiesService.getScriptProperties(); // new property service

// If you don't want to expose either GET or POST methods you can comment out the appropriate function
function doGet(e){
  return handleResponse(e);
}

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

function handleResponse(e) {
  // shortly after my original solution Google announced the LockService[1]
  // this prevents concurrent access overwritting data
  // [1] http://googleappsdeveloper.blogspot.co.uk/2011/10/concurrency-and-google-apps-script.html
  // we want a public lock, one that locks for all invocations
  var lock = LockService.getPublicLock();
  lock.waitLock(30000);  // wait 30 seconds before conceding defeat.

  try {
    // next set where we write the data - you could write to multiple/alternate destinations
    var doc = SpreadsheetApp.openById(SCRIPT_PROP.getProperty("key"));
    var sheet = doc.getSheetByName(SHEET_NAME);

    // we'll assume header is in row 1 but you can override with header_row in GET/POST data
    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 = []; 
    // loop through the header columns
    for (i in headers){
      if (headers[i] == "Timestamp"){ // special case if you include a 'Timestamp' column
        row.push(new Date());
      } else { // else use header name to get data
        row.push(e.parameter[headers[i]]);
      }
    }
    // more efficient to set values as [][] array than individually
    sheet.getRange(nextRow, 1, 1, row.length).setValues([row]);
    // return json success results
    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());
}

答案 1 :(得分:0)

1。请参考this link并按照步骤进行操作。

2。借助id或class从html表单中获取数据,以便将数据发送到Google工作表。

  <html>
  <body>
   <input type="text" name="name" class="form-control" id="name"  />
   <input type="text" name="email" class="form-control" id="email"  />
   <input type="text" name="subject" class="form-control" id="subject"  />
   <input type="text" name="message" class="form-control" id="message"  />  
  </body>


  <script>

    var script_url ="Paste URL google sheet URL which containes exec in path";
  var emailcheck=false;
  // Make an AJAX call to Google Script
  function insert_value() {

    var name= $("#name").val();
    var email= $("#email").val();
    var subject= $("#subject").val();
    var message= $("#message").val();
   var url = script_url+"?callback=ctrlq&message="+message+"&subject="+subject+"&email="+email+"&name="+name+"&action=insert"; 
    var request = jQuery.ajax({
      crossDomain: true,
      url: url ,
      method: "GET",
      dataType: "jsonp"
    });
}

</script>
</html>

3。将以下代码粘贴到Google工作表的code.js中,以通过JavaScript提取html数据。

function doGet(e){

  var op = e.parameter.action;

  var ss=SpreadsheetApp.openByUrl("Paste your sheet URL here in quatoes");
  var sheet = ss.getSheetByName("Sheet1");
  if(op=="insert")
    return insert_value(e,sheet);
}

//Recieve parameter and pass it to function to handle

function insert_value(request,sheet){
   var name = request.parameter.name;
    var email = request.parameter.email;
    var subject = request.parameter.subject;
    var message = request.parameter.message;
  var flag=1;
  if(flag==1){
  var d = new Date();
    var currentTime = d.toLocaleString();
  var rowData = sheet.appendRow([currentTime,name,email,subject,message]);  
  var result="Insertion successful";
  }
     result = JSON.stringify({
    "result": result
  });  

  return ContentService
  .createTextOutput(request.parameter.callback + "(" + result + ")")
  .setMimeType(ContentService.MimeType.JAVASCRIPT);   
  }