Google Apps Script HTML Form

by

HTML Email Form

html:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <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);
      }
    </script>
  </head>
  <body>
    <h2>Feedback Form</h2>
    <div id="message" style="color:green"></div>
    <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>
    <br /><input type="button" value="Submit" onclick="submitForm(this.parentNode);" />  
  </form>  
  </body>
</html>

Google Script:

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 to = '[email protected]'; 
  MailApp.sendEmail({to: to,subject: subject,htmlBody: body}); 
  //Logger.log('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);
  return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);
}
//It works as a dialog
function showTheDialog() {
  var userInterface=HtmlService.createHtmlOutputFromFile('aq7');
  SpreadsheetApp.getUi().showModelessDialog(userInterface, "Emails")
}

enter image description here

enter image description here

I didn’t actually test it with the mailapp line. I just used the Logger and saw that it returned the feedback message.

More Related Contents:

  1. What is the best way to parse html in google apps script
  2. Emailing Google Sheet range (with or without formatting) as a HTML table in a Gmail message
  3. Uploading Multiple Files to Google Drive with Google App Script
  4. What is the best way to parse html in google apps script
  5. Call Library function from html with google.script.run
  6. Using base64-encoded images with HtmlService in Apps Script
  7. How do I dynamically adjust css stylesheet based on browser width?
  8. Display Spreadsheet Data to HTML Table
  9. Display Spreadsheet Data to HTML Table
  10. Single event handler for four button clicks
  11. Parse an HTML string with JS
  12. In JavaScript can I make a “click” event fire programmatically for a file input element?
  13. jQuery document.createElement equivalent?
  14. How to get the raw value an field?
  15. How to fix getImageData() error The canvas has been tainted by cross-origin data?
  16. Losing scope when using ng-include
  17. Detect click event inside iframe
  18. Uploading Image to Amazon s3 with HTML, javascript & jQuery with Ajax Request (No PHP)
  19. Store jquery selector in variable
  20. Why does a FORM with one text INPUT submit on enter while one with two text INPUTs does not? [duplicate]
  21. Writing data to a local text file with javascript
  22. html download attribute redirects to url instead of downloading
  23. Preventing Canvas Clear when Resizing Window
  24. How to calculate the width of the scroll bar?
  25. How can I invoke encodeURIComponent from angularJS template?
  26. How to convert selected HTML to Json?
  27. javascript: upload image file and draw it into a canvas
  28. Extracting single frames from an animated GIF to canvas
  29. Showing Placeholder text for password field in IE
  30. What can service workers do that web workers cannot?

Leave a Comment