CODEWITHSUNDEEP
google-apps-script
Carrie
Carrie

Reputation: 1057

Google Apps Script Web App: Can't separate out css and js code

I'm trying to separate my javascript and stylesheet from the main HTML file in my Google Apps Spreadsheet script that is published as a Web App. I have seen this answer to the problem, but I cannot get this approach to work for me.

When I have my stylesheet and javascript in the main HTML file, it works fine. When I try to separate them exactly as the answer recommends, the stylesheet and javascript code is not processed and instead the line that calls 'getContent()' is displayed in my browser. It looks like getContent() is not being executed at all.

I've tried moving my code away from the Spreadsheet to a Standalone Web App but still have the same problem. Any ideas why it's not working for me? Thank you!

A bit from my Code.gs:

   function doGet() {
      var output = HtmlService.createHtmlOutputFromFile('index');
      output.setSandboxMode(HtmlService.SandboxMode.IFRAME);
      output.setTitle('Dashboard Tool');
      return output;
    }
function getContent(filename) {
  Logger.log('getContent()');  
  return HtmlService.createTemplateFromFile(filename).getRawContent();
}

index.html:

<?!= getContent("stylesheet") ?>
    <div class='header'>Dashboard</div>
    <div id=content>
Content Here
</div>
<?!= getContent("javascript") ?>

'stylesheet.html' code is surrounded by the style tag and 'javascript.html' code is surrounded by the script tag.

Upvotes: 2

Views: 1220

Answers (2)

Kriggs
Kriggs

Reputation: 3778

You forgot evaluate() in the createHtmlOutputFromFile(), also you should use the createTemplateFromFile, as such.

var output = HtmlService.createTemplateFromFile('index').evaluate();

As @brian-p pointed out, you need the 'Template' instead of 'Output', for the evaluate occur on the scriplets <?!= ?>.

Upvotes: 3

Alan Wells
Alan Wells

Reputation: 31300

In this line of code:

return HtmlService.createTemplateFromFile(filename).getRawContent();

createTemplateFromFile() is being used. That method is for creating the original template, but the getContent() function is not for that purpose. Use:

return HtmlService.createHtmlOutputFromFile(filename).getContent();

Upvotes: 1

Related Questions