提交表格后如何显示确认信息?

时间:2019-12-07 10:53:18

标签: google-apps-script google-sheets

在Google表格脚本编辑器中,我使用以下代码创建了一个表单:

.gs

function doGet() {
return HtmlService.createTemplateFromFile('Form.html')
    .evaluate() // evaluate MUST come before setting the Sandbox mode
    .setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}

var sheetName = 'Sheet1'
var scriptProp = PropertiesService.getScriptProperties()


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()
}
}

.html

<!DOCTYPE html>
<html>
<body>
<style>
</style>
<form name="submit-to-google-sheet">
<input name="text" type="text" placeholder="text" required>
<input name="email" type="email" placeholder="Email" required>
<input type="submit" name="submit" value="Submit" id="Submit" class="jfk-button jfk-button-action "> 
</form>
<script>
const scriptURL = 'https://script.google.com/macros/s/AKfycbwTGqZqLTAsOpSweMn0xgHP0sOJPsFg5ZShC1HqzVoDoNi5h5Y/exec'
const form = document.forms['submit-to-google-sheet']
form.addEventListener('submit', e => {
e.preventDefault()
fetch(scriptURL, { method: 'POST', body: new FormData(form)})
  .then(response => console.log('Success!', response))
  .catch(error => console.error('Error!', error.message))
 })
</script>
</body>
</html>

当用户提交表单时,我成功地接收了工作表中的数据,但是用户不知道他的信息已交付,因此我只需要在提交表单后显示一条确认消息,例如“谢谢!”。

提前谢谢..

2 个答案:

答案 0 :(得分:0)

我想出了一些在类似情况下可能会有所帮助的东西:

在.html文件中添加提交输入,如下所示:

<form name="submit-to-google-sheet" id="form" onsubmit="myFunction()">
<input type="submit" value="Submit">
</form>

然后添加以下脚本:

<script>
function myFunction() {
alert("The form was submitted");
}
</script>

这将在屏幕顶部触发一个窗口,该窗口显示表单已成功完成。谢谢

答案 1 :(得分:0)

一般来说,在制作提交表单时,会发送到submission.html。

<块引用>

“input type="submit”定义了一个提交按钮,将所有表单值提交给表单处理程序。表单处理程序通常是一个服务器页面,带有用于处理输入数据的脚本。表单处理程序被指定在表单的 action 属性中。