У меня есть типичная форма Google App Html, которая записывает данные, введенные в таблицу. Вот файлы.
HTML Форма:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<?!= include("css");?>
</head>
<body>
<h2>Feedback Form</h2>
<div id="message"></div>
<!--- BUTTON New registration --->
<br /><input id="button-responder" type ="button" value = "New registration"
onclick="submitResponder('button-responder'),
submitTransition('message');" style="display:none;" />
<!--- FORM --->
<form id="my-form">
<br /><input id="name" type="text" name="name" placeholder="Your Name">
<br /><input id="email" type="email" name="email" placeholder="Your Email">
<br /><textarea id="comment" rows="10" cols="40" name="comment"></textarea>
<!--- BUTTON submitForm --->
<br /><input id="btn" type="button" value="Submit"
onclick="submitForm(this.parentNode),
document.getElementById('my-form').style.display='none',
submitResponder('button-responder'),submitTransition('message');" />
</form>
<?!= include("test-js");?>
</body>
</html>
Google Script:
function doGet(request) {
return HtmlService.createTemplateFromFile('index')
.evaluate();//not all caps but it has to match the name of the file and it doesn't - Change to PAGE
}
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename)
.getContent();
}
function submitData(form) {
var subject='New Feedback';
var body=Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);
var folderId = "my-folder-ID"; // Please set the folder ID. // Added
var blob = Utilities.newBlob(body, MimeType.HTML, form.name).getAs(MimeType.PDF); // Added
var file = DriveApp.getFolderById(folderId).createFile(blob); // Added
return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s<br />
PDF: <a target="_blank" href="%s">see your PDF file</a>',
form.name,form.email,form.comment,file.getUrl());
function userClicked(userInfo){
var url = "https://docs.google.com/spreadsheets/d/my-spreadsheet-ID";
var ss = SpreadsheetApp.openByUrl(url);
var ws = ss.getSheetByName("Data");
ws.appendRow([userInfo.name, userInfo.email, userInfo.comment]);
}
test- js
<script>
function submitForm(form) {
google.script.run
.withSuccessHandler(function(value){
document.getElementById('message').innerHTML = value;
document.getElementById('name').value = '';
document.getElementById('email').value = '';
document.getElementById('comment').value = '';
})
.submitData(form);
}
function submitResponder() {
var x = document.getElementById("button-responder");
var xx = document.getElementById("my-form");
var xxx = document.getElementById("message");
if (x.style.display === "none") {
x.style.display = "block";
xx.style.display = "none";
xxx.style.display = "block";
} else {
x.style.display = "none";
xx.style.display = "block";
xxx.style.display = "none";
}
}
function submitTransition() {
setTimeout(function() {
document.getElementById('message').style.color = 'blue';}, 2500);
}
document.getElementById("btn").addEventListener("click",doStuff);
function doStuff(){
var userInfo = {}
userInfo.name = document.getElementById("name").value;
userInfo.email = document.getElementById("email").value;
userInfo.comment = document.getElementById("comment").value;
google.script.run.userClicked(userInfo);
document.getElementById("name").value= "";
document.getElementById("email").value= "";
document.getElementById("comment").value= "";
}
</script>
css:
<style>
#message {
color: transparent;
}
</style>
ВОПРОС
Теперь в функции файла Google Script
функция submitData (форма)
и в тесте - js функция файла
функция doStuff ()
они хорошо выполняют свою работу, но с задержкой около 2,5 s затем для Google Script, чтобы подать функцию
return Utilities.formatString
может показать результат (имя - электронная почта - комментарий - PDF URL), его заключение должно ожидаться , 2,5 с.
Функции в переменных.
В тесте - js функция файла
функция submitResponder ()
делает поля, связанные с идентификатором (сообщением) видимыми с переменными
name: example-name
email: example-email
comment: example-comment
PDF: see your example-PDF file
и поле, связанное с идентификатором (кнопка-ответчик)
" Кнопка «Новая регистрация»
Затем при загрузке страницы индекса. html отобразятся форма и кнопка «Отправить», отредактируйте поля, нажав «Отправить» для m скрыта, появляется кнопка «Новая регистрация» и примерно через 2,5 с появляются также отредактированные поля (имя-адрес электронной почты ....).
Нажмите кнопку «Новая регистрация» под формой, снова появится как в начале, явно не со страницы перезагрузки, а просто с
- display = "none"
- display = "block"
Теперь вот проблема, которую я не могу решить:
После повторного редактирования полей и повторного нажатия на форму отправки поля, отредактированные в предыдущий раз, снова появляются немедленно
name: example-name
email: example-email
comment: example-comment
PDF: see your example-PDF file
и примерно через 2,5 с они обновляются с новыми отредактированными полями
name: new-name
email: new-email
comment: new-comment
PDF: see your new-PDF file
Теперь с функцией
функция submitTransition ( ) {setTimeout (function () {document.getElementById ('message'). style.color = 'blue';}, 2500); }
и со стилем
# message {цвет: прозрачный; }
Я пытаюсь найти решение, чтобы отложить (скрыть) отображение старых полей до обновления новых.
Это, безусловно, неправильный путь.
Надеюсь, я ясно объяснил, ваша помощь будет очень полезна.
Заранее спасибо.