Automatically update Google Apps Script webapp

Question

I have a Google web app displaying an HTML dashboard with data pulled in via AJAX. The Spreadsheet is populated using a Google Form and I'd like the data (mock election results) to be updated every 10 seconds or so as votes come in so teachers can see live results.

Here's the relevant portion of the app:

code.gs

function getData() {
  var sheet = ss.getSheets()[3];
  var data = sheet.getDataRange().getValues();
  Logger.log(data);
  return JSON.stringify(data);
}

function doGet() {
  return HtmlService
    .createTemplateFromFile("index")
    .evaluate();
}

HTML template

      function popularVote(data) {
        var getDivs = document.getElementsByClassName("percent");
        var data = JSON.parse(data);

        for(var j=0;j<getDivs.length;j++) {
          getDivs[j].textContent = ((data[j][1]/data[j][2]) * 100).toFixed(1) + "%";
        }
      }
      google.script.run.withSuccessHandler(popularVote).getData();

      <div class="card" id="popular">
          <div class="cand" id="cand1">
            <h2>Candidate:</h2><span class="percent">Loading...</span>
          </div>
          <div class="cand" id="cand2">
            <h2>Candidate:</h2><span class="percent">Loading...</span>
          </div>
          <div class="cand" id="cand3">
            <h2>Candidate:</h2><span class="percent">Loading...</span>
          </div>
        </div>

What I can't figure it out is what actually pulls the data. Is the the success handler polling the server? Or is it the client-side script? Where should I include Utilities.sleep or similar?

hey BTW how did you manage to indent your code in the google sciprts?? when I try to use tab when editing an HTML file it wont work — B''H Bi'ezras -- Boruch Hashem, Jan 29 '20 at 05:24

J_Everhart383 · Accepted Answer · 2016-10-31T16:18:27.827

0

It seems like this line is getting the data from the spreadsheet:

google.script.run.withSuccessHandler(popularVote).getData();

You could try wrapping this line in setInterval so that it is called every ten seconds:

setInterval(function(){ 
 google.script.run.withSuccessHandler(popularVote).getData(); 
 }, 10000);

There also may be a Google Apps Script equivalent for setInterval.

edited Oct 31 '16 at 16:18

answered Oct 31 '16 at 14:56

J_Everhart383

354
1
6

`setTimeout` ran it once after 10 seconds, but that led me to `setInterval` which works great. Thanks. – Brian Oct 31 '16 at 15:51
Haha, duh on my part. I updated the answer to use setInterval instead. – J_Everhart383 Oct 31 '16 at 16:18
setInterval works well, but isn't there a way to update the html page like real time? – Bruno Yuzo May 10 '19 at 14:02

Automatically update Google Apps Script webapp

1 Answers1

Linked