Как изменить внешний вид моего веб-приложения при отправке формы? - PullRequest
Новая
       39

Как изменить внешний вид моего веб-приложения при отправке формы?

0 голосов
/ 05 марта 2019

Хорошо, у меня есть компоненты, сценарий, функция doget и форма ввода html.

doget вызывает форму: 

function doGet() {
  return HtmlService.createHtmlOutputFromFile("inputHtml.html");

}

И форма для отправки вызововсценарий тестирования 

<input 
     type="button" 
     value="SPLIT gSheet" 
     onclick="google.script.run
      .withSuccessHandler(function(response){console.log(response);})
      .test(this.parentNode);" 
      style="background-color:#1a73e8;border-radius:10px;padding:5px;color: #fff; border-color: white;"
  />

и код возвращает ответ в журнал консоли. 

function test(e){

  var string = e.original + e.location + e.prefix;

var gDrive = e.original;
var filePrefix = e.prefix;
var destination = getIdFromUrl(e.location);
// do something with input
  return string;    

}//*****************************************************************************

Мой вопрос сам по себе является базовым, и я был бы рад, если бы на меня указалихороший учебник.

Как сделать так, чтобы скрипт сам очищался / вызывал новую html-страницу после запуска?Или пока он работает?В идеале это будет показывать страницу обработки при нажатии и страницу вывода при завершении?

1 Ответ

0 голосов
/ 05 марта 2019

Вот форма, которую я использую для загрузки файлов: 

<!DOCTYPE html>
<html>
  <head>
  <script>

  function fileUploadJs(frmData) 
  {
    document.getElementById('status').style.display ='inline';
    google.script.run
      .withSuccessHandler(updateOutput)
      .uploadTheFile(frmData)
  };
  function updateOutput(info) 
  {
    var br='<br />';
    var outputDiv = document.getElementById('status');
    outputDiv.innerHTML = br + 'File Upload Successful.' + br + 'File Name: ' + info.name + br + 'Content Type: ' + info.type + br + 'Folder Name: ' + info.folder;
  }
</script>
<style>
  body {background-color:#ffffff;}
  input{padding:2px;margin:2px;}
</style>
  </head>
  <body>
    <h1 id="main-heading">Main Heading</h1>
    <div id="formDiv">
      <form id="myForm">
        <input name="fileToLoad" type="file" /><br/>
        <input type="button" value="Submit" onclick="fileUploadJs(this.parentNode)" />
      </form>
    </div>
  <div id="status" style="display: none">
  <!-- div will be filled with innerHTML after form submission. -->
  Uploading. Please wait...
  </div>  
  <div id="controls">
      <input type="button" value="Close" onClick="google.script.host.close();" />
  </div>
</body>
</html>

Вот gs: 

function uploadTheFile(theForm) {
  var fileBlob=theForm.fileToLoad;
  var fldr = DriveApp.getFolderById(getGlobal('ExportsFolderId'));
  var file=fldr.createFile(fileBlob);
  var fi=formatFileName(file);
  var fileInfo={'name':fi.getName(),'type':fileBlob.getContentType(),'folder':fldr.getName()};
  return fileInfo;
}
...