lernbr
lernbr

Reputation: 471

Why is my Scriptlet not working html Apps Script

I'm trying to include a scriptlet in my apps script project so that I can separate html and css. When I do this, the scriptlet is printing out as plain text and the css isn't changing my html. I've included my code below!

Image of Output

HTML

<!DOCTYPE html>
<html>
  <head>
    <base target="_top"> 
    <?!= include('css') ?>
  </head>
  <body>

code.gs

var ui = SpreadsheetApp.getUi();

/**
 * Creates menu add on for Google sheets.
 * Runs the function sendEmails
 */
function onOpen () {

  ui.createMenu('Mail Merge')
    .addItem('Start mail merge utility', 'sendEmails')
    .addItem('Show prompt', 'myMenuPrompt')
    .addToUi();

}

function onInstall(e) {
  onOpen(e);
}

function myMenuPrompt(){

  var html = HtmlService
    .createHtmlOutputFromFile('index')
    .setWidth(500)
    .setHeight(370);
  ui.showModalDialog(html, 'my app');

}

function include(filename) {
  return HtmlService.createHtmlOutputFromFile(filename)
      .getContent();
}

Upvotes: 1

Views: 1554

Answers (2)

Raserhin
Raserhin

Reputation: 2676

Cooper answer is correct and it solves perfectly your issue, just to add on explanation and why that will make your code work.

What you lack in your code is to add the evaluate method that will actually pre execute the script

From the official documentation page you can read what is actually happening:

function doGet() {   return HtmlService
      .createTemplateFromFile('Index')
      .evaluate(); } 

The function shown here generates an HtmlTemplate object from the HTML file, then calls its evaluate() method to execute the scriptlets and convert the template into an HtmlOutput object that the script can serve to the user.

Upvotes: 1

Cooper
Cooper

Reputation: 64062

function myMenuPrompt(){
  var html = HtmlService.createTemplateFromFile('index').evaluate().setWidth(500).setHeight(370);
  ui.showModalDialog(html, 'my app');
}

Upvotes: 2

Related Questions