-1

I'm creating a function within Google Apps whereby I need to email the spreadsheet I am working on as a PDF. The user should click on a button and a dialogue box should open whereby they can enter email address, subject and message and send the email from there.

I've created the email dialogue as a sidebar with the following HTML:

<!DOCTYPE html>
<html>
    <head>
       <link rel = "stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
       <base target="_top">
    </head>
    <body>
       <form>
         <div class="form-group">
           <label for="exampleInputEmail1">Email address</label>
           <input type="email" class="form-control" id="exampleInputEmail1" ar.  ia-describedby="emailHelp" value="[email protected]">
         </div>
         <div class="form-group">
            <label for="subject">Subject</label>
            <input type="input" class="form-control" id="subject" value="Contract    renewal - Miki Travel">
         </div>
         <div class="form-group">
             <label for="subject">Message</label>
             <textarea class="form-control" rows="12" id="text"></textarea>
         </div>

         <button type="submit" class="btn btn-primary">Submit</button>
       </form>
    </body>
</html>

However, when I'm writing the script to send the email, how do I store the content of the email box here as variable to use for sending the email? The same will apply obviously to the subject and the message itself.

Improve this question

2 Answers 2

Reset to default
1

1) Define name properties for your inputs. Currently, none of your form fields has the 'name' property. Here's the example of how it should look like

   <input type="email" name="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" value="[email protected]">

This will allow you to access the properties of the form object when the form is submitted (e.g., form.email, form.subject, etc);

2) On the client-side (html), you must write the code to handle the 'submit' event. Add the following before the closing </body> tag:

<script>


window.onload = function() {


    document.getElementsByTagName('form')[0]
            .addEventListener('submit', function(e){

              e.preventDefault(); // intercept redirect to another page
              google.script.run.handleFormSubmit(this); // pass the form object to the server-side function. 



            });

 }



 </script>

You can also use jQuery to achieve the same result. Here's my server-side (.gs) function that logs the contents of the input fields

function handleFormSubmit(form) {

  Logger.log(form.email);
  Logger.log(form.subject);
  Logger.log(form.message);

}

Use google.script.run for client-server communication. See the docs for more details https://developers.google.com/apps-script/guides/html/communication

Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

this is great thanks!!!! One more question - how can I pre-populate the email input in my HTML file with a value from my spreadsheet. The email address is listed in cell B15 and I tried to extract this as follows: function getEmail() { var s=SpreadsheetApp.getActive().getSheetByName("Template"); var row=15; var column=2; var n=Utilities.formatString('%s',s.getRange(row, column).getValue()); return n; Logger.log(n); } This is not logging anything though and so won't be able to move to the next stage of populating this in the HTML (which I'm not too sure about either!)
That's hardly surprising as you placed the 'return' statement before the Logger.log() call. Anything after 'return' won't execute. I suggest you spend more time learning the basics of JavaScript. To pass variables from GAS to client-side HTML, check this answer stackoverflow.com/questions/45247987/…
Happy to help. If my original answer solved your question (which I assume it did), please mark the question as resolved.
0

You can send pdf but Google App script does support below extension file .xls and .xlsx in mail service of google API through google app script its only supports pdf and image format attach file go through this link u will get more info regrading this

https://developers.google.com/apps-script/reference/base/blob#getAs(String)

if u still try to attach .xlsx and .xls file it through an error its does not support i already faced this issue but u can download as xlsx format through javascript.

Improve this answer

6 Comments

Thanks. Actually I need it to be in PDF format. The sheet is actually a contract template that we need to send to suppliers and so they need to receive this in a PDF format. My main issue though is how to extract the email address from the form and use that as var emailAddress in my google apps script
I can't get u here (My main issue though is how to extract the email address from the form and use that as var emailAddress in my google apps script) can u explain me clearly r u extrating the mail from sheet or manually entering
I can help out if u describe briefly i worked on this already
so I have added a custom menu item to the UI called "Email Form" and this opens up a sidebar (coded in HTML with the HTML editor provided within the Google scripts environment). Here there are fields for email, subject and message. So the user will enter the email address where they want the doc to go, the subject and the message and then when they click submit on the form, this should run the script to send the PDF. So within the google apps script for sending the email, I need to set var emailAddress as whatever is entered into the email input on the form.
ok i got ur point u can acheieve this by following below steps
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.