I am trying to write a Google Apps Script that when published as a Web App will have a button, which when pressed, will call a function from Code.gs that will reveal or hide a piece of html (in effect, change the style of the div with a specific ID).
This is a small case example I've set up:
My index.html file:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<button onclick="google.script.run.myFunction()">Click Me</button>
<div id="myDIV">
This is my DIV I want to Reveal/Hide.
</div>
</body>
</html>
My Code.gs file:
function doGet() {
var template = HtmlService.createTemplateFromFile("index.html");
var html = template.evaluate();
return HtmlService.createHtmlOutput(html);
}
function myFunction() {
var x = document.getElementById("myDIV");/*Where the Reference Error Shows Up*/
if (x.style.display === "none") {
x.style.display = "block";
}
else {
x.style.display = "none";
}
}
The error I keep getting when debugging is: ReferenceError: "document" is not defined. When published, the button appears with myDIV visible, and clicking the button does nothing.
I am assuming the problem is that I should not be using document.getElementByID(), but rather somethingelse.getElementByID(), but I don't know what that something else is. Most cases that I look for online are not specific to Google Web Apps. Any help would be appreciated.
Aucun commentaire:
Enregistrer un commentaire