Show the Value on form real time - app script-CodePudding

i need help on the web app form. im faceing issue how to show the value real time on webapp form. i right code.gs but im unbale to create javascript for run the function interval level.

please help me on this.

function getTime(){
    
  const ss =SpreadsheetApp.getActiveSpreadsheet()
      const wsData = ss.getSheetByName("Run")
      const emp = [Session.getActiveUser().getEmail()];
      const now = new Date();
      const d= wsData.getDataRange().getDisplayValues().reverse();
      const emp_i = d.findIndex(r => r[1] === emp.toString());
      if (emp_i == -1 && d[emp_i][4] == "");
      const hour = new Date(now - new Date(d[emp_i][3])).toISOString().substr(11,8 );
      return hour;
}

var Duration = [getTime()];

<label for="Duration">Last Activity Duration</label>
            <select class="w3-select"  id="Duration">
               
                <? for(let i=0;i<Duration.length;i  ){ ?>
                <option>
                    <?= Duration[i]; ?>
                </option>
                <? }?>
            </select>
        </div>

CodePudding user response：

I don't see how your getTime() is going to return an array:

function getTime() {
  const ss = SpreadsheetApp.getActiveSpreadsheet()
  const wsData = ss.getSheetByName("Run")
  const emp = [Session.getActiveUser().getEmail()];
  const now = new Date();
  const d = wsData.getDataRange().getDisplayValues().reverse();
  const emp_i = d.findIndex(r => r[1] === emp.toString());//emp.toString() doesn't look right
  if (emp_i == -1 && d[emp_i][4] == "");//I don't think this line is doing anything
  const hour = new Date(now - new Date(d[emp_i][3])).toISOString().substr(11, 8);
  return hour;
}

but I think you need a doGet() something like this:

function doGet(e) {
  const ui = SpreadsheetApp.getUi();
  let t = HtmlService.createTemplateFromFile('filename');//create a template
  t.Duration = getTime(); // assign global variables to the template this way
  return t.evaluate();//this is htmloutput
}

It's actually hard to tell what you want from your code. It might be better to just explain what you want to do in words.

CodePudding user response：

If you want to retrieve the date in real time, you will have to handle everything in the client side and use the server side to make the request, something similar to this:

Code.gs

function doGet(e) {
   return HtmlService.createHtmlOutputFromFile('html');
}

html.html

<!DOCTYPE html>
<html>
   <head>
      <base target="_top">
   </head>
   <p id="time"></p>
   <body>
      <script>
         var timeDisplay = document.getElementById("time");
         function getTime() {
            var dateString = new Date().toLocaleString("ZONE", {timeZone: "YOUR_TIMEZONE"});
            var formattedString = dateString.replace(", ", " - ");
            timeDisplay.innerHTML = formattedString;
         }
         setInterval(getTime, 1000);
      </script>
   </body>
</html>

However, if you'd like to simply call the function from the Apps Script code, you should update your client side code to this:

<script>
   for (let i = 0; i < length; i  ) {
      google.script.run.getTime();
   }
</script>

Communicating with the Apps Script functions is done by using google.script.run. This is an asynchronous client-side JavaScript API that allows HTML-service pages to call the server-side functions.

Reference