如何使用 Google Apps 从 html 表单中获取输入文本？答案

【问题标题】：How to get input text from html form with Google Apps?如何使用 Google Apps 从 html 表单中获取输入文本？
【发布时间】：2020-02-01 23:18:06
【问题描述】：

我的 Google Apps 脚本将表单输入从 html 文件提交到指定的 Google 表格电子表格。完成此操作后，它会运行一个函数，在表单提交上向指定的收件人发送电子邮件通知。一切正常，但我正在尝试获取特定的表单输入（姓名、电话、分机、电子邮件等）并将它们发送到我的电子邮件正文中。

这是我的 Google Apps 脚本 SendNotification 函数：

//EMAIL NOTIFICATION
function sendNotification(e) {
   var ss = SpreadsheetApp.getActiveSpreadsheet();
   var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Sheet1");
   var range = sheet.getActiveRange().getA1Notation();
   var recipients = "test@gmail.com";
   var message = '';
function createSpreadsheetChangeTrigger() {
   var ss = SpreadsheetApp.getActive();
   ScriptApp.newTrigger('onFormSubmit')
     .forSpreadsheet(ss)
     .onFormSubmit()
     .create();
   }  
   var subject = 'Client Lead Notification';
   var body = 
      'You have a new client submission on your Google Sheets spreadsheet' + 
      '<body>' + 
      '<p>Name : '+e.parameters.name+'</p>' +
      '<p>Email : '+e.parameters.name+'</p>' +
      '<p>Contact : '+e.parameters.name+'</p>' +
      '</body>'; + ss.getUrl();
   MailApp.sendEmail(recipients, subject, body);
};

剩下的代码如下：

//FORM SUBMISSION
var sheetName = 'Sheet1'
var scriptProp = PropertiesService.getScriptProperties()

function intialSetup () {
   var activeSpreadsheet = SpreadsheetApp.getActiveSpreadsheet()
   scriptProp.setProperty('key', activeSpreadsheet.getId())
}

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

function doPost (e) {
   var lock = LockService.getScriptLock()
   lock.tryLock(10000)

   try {
      var doc = SpreadsheetApp.openById(scriptProp.getProperty('key'))
      var sheet = doc.getSheetByName(sheetName)
      var headers = sheet.getRange(1, 1, 1, sheet.getLastColumn()).getValues()[0]
      var nextRow = sheet.getLastRow() + 1
      var newRow = headers.map(function(header) {
         return header === 'timestamp' ? new Date() : e.parameter[header]
      })

   sheet.getRange(nextRow, 1, 1, newRow.length).setValues([newRow])
   return ContentService
     .createTextOutput(JSON.stringify({ 'result': 'success', 'row': nextRow }))
     .setMimeType(ContentService.MimeType.JSON)
   }

   catch (e) {
      return ContentService
         .createTextOutput(JSON.stringify({ 'result': 'error', 'error': e }))
         .setMimeType(ContentService.MimeType.JSON)
   }

   finally {
      lock.releaseLock()
      sendNotification()
   }
}

我没有使用 Javascript/GS 的经验！我仍在学习并且在游戏引擎中使用 HTML/CSS 和 C++ 的历史 - 所以请原谅我的新手问题。

【问题讨论】：

html 表单没有 onFormSubmit 触发器。它们仅适用于 Google 表单。
这是一个使用 html 表单提交表单的示例：stackoverflow.com/a/59585277/7215091

标签： html forms google-apps-script google-sheets

【解决方案1】：

带有表单的简单对话框

function runMeFirst() {
  var ss=SpreadsheetApp.getActive();
  var html='<style>td,th{border:1px solid white;}</style><form name="myForm"><table>';
  html+='<tr><td><input type="text" name="First" placeholder="First" /></td><tr></tr>';
  html+='<tr><td><input type="text" name="Last" placeholder="Last" /></td><tr></tr>';
  html+='<tr><td align="center"><input type="button" value="Submit" onClick="saveData(myForm);" /></td><tr></tr>';
  html+='</table></form>';
  html+='<script>function saveData(form){console.log(form);google.script.run.processData(form);}console.log("My Code");</script>';
  var userInterface=HtmlService.createHtmlOutput(html);
  SpreadsheetApp.getUi().showModelessDialog(userInterface, 'Data');
}

function processData(data) {
  var ss=SpreadsheetApp.getActive();
  var sh=ss.getActiveSheet();
  Logger.log(data);
  sh.appendRow([data.First,data.Last]);
}

【讨论】：