1

So, I have this function that creates a dialog box in HTML. This function is also passed a message, as can be seen below:

Apps Script code:

function emailPrompt(msg) {
  var html = HtmlService.createHtmlOutputFromFile('sendEmail')
      .setWidth(600)
      .setHeight(900);
    SpreadsheetApp.getUi()
      .showModalDialog(html, 'Send Email');
}

sendEmail.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <textarea id="user-input-box" rows="38" cols="80"> [add pre-message here] </textarea>
    <input type="button" value="Submit" 
     onclick="google.script.run.MyMessage();" />
    <input type="button" value="Cancel" onclick="google.script.host.close();" 
     />
    <script>
      function MyNote() {
        var userInput = document.getElementById("user-input-box").value;
      }
    </script>
  </body>
</html>

How can I put the msg variable in the [add pre-message here] section of the textarea? I've been researching for hours online for this but really can't find anything.

Mogsdad
  • 44,709
  • 21
  • 151
  • 275
coolyfrost
  • 145
  • 10

1 Answers1

3

In your case, how about using Templated HTML? When your script is modified, it becomes as follows.

Modified script:

Google Apps Script side:

function emailPrompt(msg) {
  
  msg = "sample";  // As a sample, how about using this line?
  
  var html = HtmlService.createTemplateFromFile('sendEmail');
  html.msg = msg;
  SpreadsheetApp.getUi().showModalDialog(html.evaluate().setWidth(600).setHeight(900), 'Send Email');
}

HTML&Javascript side:

<!DOCTYPE html>
<html>

<head>
  <base target="_top">
</head>

<body>
  <textarea id="user-input-box" rows="38" cols="80"><?= msg ?></textarea>
  <input type="button" value="Submit" onclick="google.script.run.MyMessage();" />
  <input type="button" value="Cancel" onclick="google.script.host.close();" />
  <script>
    function MyNote() {
      var userInput = document.getElementById("user-input-box").value;
    }
  </script>
</body>

</html>

Reference:

Added:

Modified script:

From: 
function emailPrompt(msg) {
  var html = HtmlService.createHtmlOutputFromFile('sendEmail');
  html.msg = msg;      
  SpreadsheetApp.getUi().showModalDialog(html.evaluate().setWidth(600).setHeight(900), 'Send Email');
 
}
To: 
function emailPrompt(msg) {
  var html = HtmlService.createTemplateFromFile('sendEmail');  // <--- Modified
  html.msg = msg;
  SpreadsheetApp.getUi().showModalDialog(html.evaluate().setWidth(600).setHeight(900), 'Send Email');
 
}

References:

Tanaike
  • 181,128
  • 11
  • 97
  • 165
  • My apologies, it seems I made a slight mistake on line 2 of my GS code, I forgot to take out that function which didn't work and replace it with 'sendEmail', but have just updated it. When I tried modifying your code to conform to yours, it appears that the script fails to execute, but I also don't get any error messages to tell me what's wrong. – coolyfrost Jul 11 '20 at 04:24
  • 1
    @coolyfrost Thank you for replying. I confirmed your updated question just now. It's no problem. In this case, when you modified `getHTMLOutput(msg)` to `'sendEmail'` and you modified the file of `sendEmail` to my proposed HTML side, I think that the modified script works. So unfortunately, I cannot replicate your situation. This is due to my poor skill. I deeply apologize for this. So in order to correctly understand about your situation, can you provide the sample Spreadsheet including the current script for replicating your issue? By this, I would like to confirm it. How about this? – Tanaike Jul 11 '20 at 04:28
  • @coolyfrost By the way, when you test this script, please give the value to `msg`. By this, you can see the value at HTML side. For this, I added one line in the function `emailPrompt`. Could you please also confirm it? – Tanaike Jul 11 '20 at 04:31
  • unfortunately the sheet itself belongs to my company and contains sensitive information. However, I made a version emulates what the sheet is supposed to do and contains the same error here: https://docs.google.com/spreadsheets/d/1dNGnTQJzYum4KeuwljA8qOy5lFAc9hvViUPN5ZzN8A0/edit?usp=sharing . Really appreciate your help! I need to go to sleep now but I'll answer you in the morning, thanks so much – coolyfrost Jul 11 '20 at 04:40
  • @coolyfrost Thank you for replying and providing the sample Spreadsheet. From it, I could understand about your current issue. The reason of your issue is that your modified script doesn't correctly reflect my proposed script. I apologize for not explaining enough and my poor English skill. So I added one more modification point for your current script. Please confirm it and test it again? – Tanaike Jul 11 '20 at 04:46
  • 1
    @coolyfrost Also, when I saw your script, if you want to run the function `onEdit_sendEmail` by the OnEdit event trigger, please install the OnEdit event trigger to the function `onEdit_sendEmail`. [Ref](https://developers.google.com/apps-script/guides/triggers/installable#managing_triggers_manually) – Tanaike Jul 11 '20 at 04:51
  • 1
    Thank you! It works perfectly. Are there any resources you'd recommend for me to better understand what templates do? I've seen that page before but it was very confusing to me – coolyfrost Jul 11 '20 at 15:33
  • 1
    @coolyfrost Thank you for replying. I'm glad your issue was resolved. About the references, I always see [the official document](https://developers.google.com/apps-script/guides/html/templates). But if you want to see the sample scripts for this, I think that you can also see the various good sample scripts in Stackoverflow. – Tanaike Jul 12 '20 at 00:07