Google app script on how to create a pdf from the

Google app script on how to create a pdf from the data received from an html form of your spreadsheet and send the pdf file via email - I would like to create a pdf file from the data recorded on the worksheet via a custom html form

I have a simple html form with email sending

this is the index html FORM file:

<!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>
    <?!= include("css");?>
  </head>
  <body>
    <h2>Feedback Form</h2>
    <div id="message"></div>

    <br /><input id="button-responder" style="display:none;" type ="button" onclick="submitResponder();" value = "Nuova iscrizione">

    <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>
    <br /><input id="btn" type="button" value="Submit" onclick="submitForm(this.parentNode),document.getElementById('my-form').style.display='none',submitResponder('button-responder');" />
  </form>
  <?!= include("test-js");?>  
  </body>
</html>

this Google Script with alias email:

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 aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body});

  return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s', form.name,form.email,form.comment);

  
}


function userClicked(userInfo){
    var url = "https://docs.google.com/spreadsheets/x/xx-xx-xxx_-xxxxxxxxxx-xxxx/edit#gid=x";
    var ss = SpreadsheetApp.openByUrl(url);
    var ws = ss.getSheetByName("Data");
    ws.appendRow([userInfo.name, userInfo.email, userInfo.comment]);
}

this is custom javascript file ("test-js"):

<script>

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";
  }
}


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>

this is a simply css style file ("css"):

<style>

#message {
 color: red;
}

</style>

I'm looking for a formula to create a pdf file by taking the data entered in the forms and send it by email. The file must be created in a specific folder / subfolder in drive. The name of the file must replay the "name" field edited on the form.

Now the most important part. I would like the link of the pdf file to appear only on the html page and not in the email, as shown in the example below:

return Utilities.formatString ('name:% s <br /> Email:% s <br /> Comment:% s', form.name, form.email, form.comment)
link to PDF file

Thanks in advance for the help!

NEW QUESTION!!

In relation to the function described below:

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

  var aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body, attachments: [blob]});  // Modified

//  return file.getUrl();  // Modified
  return Utilities.formatString('name: %s <br />Email: %s<br />Comment: %s<br />PDF: %s', form.name,form.email,form.comment,file.getUrl());
}

I am looking for I'm trying to return in a generic test format of the type "see your PDF file" clickable, instead of the URL address, in the function:

return Utilities.formatString ('name:% s <br /> Email:% s <br /> Comment:% s <br /> PDF:% s', form.name, form.email, form.comment, file. getUrl ());

I wish I could use a basic document as a template for the style of creating the PDF file similar to this: https://jeffreyeverhart.com/2018/09/17/auto-fill-google-doc-from-google-form-submission/ Keep in mind that my application is a custom html form as you can see from the place above.

Thanks in advance for the help!

标签： javascript html forms google-apps-script

1条回答

叛逆

2楼-- · 2020-02-16 02:56

You want to convert var body=Utilities.formatString('name: %s Email: %s Comment: %s', form.name,form.email,form.comment); as a PDF file.
You want to put the created PDF file to the specific folder in Google Drive.
You want to send the created PDF file as an attachment file.
You want to retrieve the URL of created PDF file and return it to HTML side.
Your question is unrelated to Spreadsheet.

I could understand like above. If my understanding is correct, how about this answer? Please think of this as just one of several possible answers.

Modification points:

In your case, I think that your goal can be achieved by modifying submitData() at Google Apps Script side.
When the button is pushed, create a PDF data from var body=Utilities.formatString('name: %s Email: %s Comment: %s', form.name,form.email,form.comment);. And create the PDF data as the file.

Modified script:

Please modify submitData() as follows. Please set the folder ID to var folderId = "###".

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 = "###"; // 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

  var aliases = GmailApp.getAliases()
   Logger.log(aliases); //returns the list of aliases you own
   Logger.log(aliases[0]); //returns the alias located at position 0 of the aliases array

  GmailApp.sendEmail('my-email@my-email.com','From an alias', 'A message from an alias!', {'from': aliases[0],subject: subject,htmlBody: body, attachments: [blob]});  // Modified

  return file.getUrl();  // Modified
}

Note:

If you want to modify the style of PDF file, please modify name: %s Email: %s Comment: %s of var body=Utilities.formatString('name: %s Email: %s Comment: %s', form.name,form.email,form.comment);. You can use HTML in this case.
By the situation, it might be required to share the created PDF file.

References:

0人赞添加讨论(0) 举报