如何保持状态持续显示在JavaScript函数到HTML上 [英] How keep the Status keep appearing on JavaScript function to HTML

查看:43
本文介绍了如何保持状态持续显示在JavaScript函数到HTML上的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是先前问题我在这个论坛上提出的.

This is a continuation of previous question I made in this forum.

我通过添加else条件对代码进行了一些更改.我要解决的问题是在页面加载时显示当前状态.当前代码仅在单击按钮时显示状态.

I made some changes in the code by adding else condition. What I'm trying to work out is to show the current status as the page loads. the current code shows the status only if the button get clicked.

如何在加载页面时显示当前状态,并在单击按钮时更新状态.

How can I get the current status appear as the page loads and the status get updated when button get clicked.

CODE.GS

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

function checkStatus(notify) { 
  var employee = "John Peter";
  var ss = SpreadsheetApp.getActiveSpreadsheet();        
  var mainSheet = ss.getSheetByName("MAIN");
  var data = mainSheet.getDataRange().getValues();
  
  for (var j = 0; j < data.length; j++){
    var row = data[j];
    var mainSheet2 = row[4];
    var mainSheet3 = row[0];
    var status = (mainSheet2 =="IN" && mainSheet3 == employee) ; 
    if (status == true){
      var notify = employee +" You Are In"
      return notify;
      }
    else{
     var status = (mainSheet2 =="OUT" && mainSheet3 == employee) ; 
    if (status == true){
      var notify2 = employee +" You Are Out"
      return notify2;
  }
}
  }
}

Index.html

Index.html

<body>
    <div>
      <button onclick="onStatus()">Check Status</button>
      <font color='Green' id="status" onbeforeprint="onStatus" ></font>
      </div>
      
    

    <script>
      function onStatus() {
        google.script.run.withSuccessHandler(updateStatus) // Send the backend result to updateStatus()
          .checkStatus(); // Call the backend function
      }

      function updateStatus(notify) {
        document.getElementById('status').innerHTML= notify;
      }
      
     
      
    </script>
  </body>

推荐答案

您可以在页面加载时调用此函数,如下所示.在您的body标签结束之前,在结尾处添加此脚本.

You can invoke this function at page load like below. Add this script at then end, just before your body tag ends.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script>
    // The code in this function runs when the page is loaded.
    $(function() {
     google.script.run.withSuccessHandler(updateStatus)
              .checkStatus(); 
    });
</script>

这篇关于如何保持状态持续显示在JavaScript函数到HTML上的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆