在 Google App 脚本中禁用有条件的按钮

Question

我有一个代码，当付款到当月时，PayPal 按钮将被禁用。但是，我注意到，由于我的网络应用程序中有一个过滤器按钮，允许用户检查前几年的付款历史记录，如果我点击前一年，即使付款是在当月支付的，它会显示贝宝按钮，任何人都可以帮我解决这个问题？

当月付款完成时禁用按钮的代码

var today = new Date();
      var year = today.getFullYear();
      var month = today.getMonth();
      if (!ar.some(([a,,,d]) => {
        var t = new Date(a);
        return year == t.getFullYear() && month == t.getMonth() && d.toUpperCase() == "PAID";
        })) {
              document.getElementById("digitalgoods-030521182921-1").style.display = "block";
            }

JavaScript.html 代码

<script>
    var username = ""; // Added
    function GetRecords() {
    var spin = "<span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>";
    spin += " Loading...";
    document.getElementById("LoginButton").innerHTML = spin;

    username = document.getElementById("username").value; // Modified
    var password = document.getElementById("password").value;
    var password = document.getElementById("password").value;
      
      google.script.run.withSuccessHandler(function(output) {
        console.log(output);
        var username = output[1];
        var name = output[2];
        if(output[0] == 'TRUE') {
          document.getElementById("loginDisplay").style.display = "none";
          document.getElementById("dataDisplay").style.display = "block";  
          document.getElementById("errorMessage").innerHTML = "";
          document.getElementById("currentUser").value = name; // CHANGE
          google.script.run.withSuccessHandler(displayTable).GetRecords(username,"None");

        } else if(output[0] == 'FALSE') {
          document.getElementById("firstLastName").innerHTML = "";
          document.getElementById("currentUser").value = "";
          document.getElementById("myFilter").innerHTML = "";
          document.getElementById("errorMessage").innerHTML = "Failed to Login";
          document.getElementById("LoginButton").innerHTML = "Login";   
        }
      }).checkLogin(username, password);
    }
    
    function filter(){
     var filterStr = document.getElementById("filterYear").value;
     google.script.run.withSuccessHandler(displayTable).GetRecords(username, filterStr);
    }

    function displayTable(result) {
    var ar = result.data;
    var filterString = result.filter;
    ar = ar.sort((a, b) => new Date(a).getTime() > new Date(b).getTime() ? -1 : 1).splice(-12); // <--- Added
    var name = document.getElementById("currentUser").value;  // CHANGE
      if(ar.length > 0) {
        var displayTable = '<table class=\"table\" id=\"mainTable\">';

        displayTable += "<tr>";
        displayTable += '<th style=\"text-align: center;\">Month</th>';
        displayTable += '<th style=\"text-align: center;\">House Number</th>';
        displayTable += '<th style=\"text-align: center;\">Street</th>';
        displayTable += '<th style=\"text-align: center;\">Payment Status</th>';
        displayTable += "</tr>";

        ar.forEach(function(item, index) {
          displayTable += "<tr>";
          displayTable += "<td style=\"text-align: center;\">"+item[0]+"</td>";
          displayTable += "<td style=\"text-align: center;\">"+item[1]+"</td>";
          displayTable += "<td style=\"text-align: center;\">"+item[2]+"</td>";
          displayTable += "<td style=\"text-align: center;\">"+item[3]+"</td>";
          displayTable += "</tr>";
        });

        displayTable += "</table>";

      } else {
        var displayTable = "<span style=\"font-weight: bold\" >No Records Found</span>";
      }
      
       var filter = '';
      if(filterString.length > 0) {
        filter += '<label for="years" style="font-size: 20px">Select the Year</label><br><select class="form-control form-control-sm" id="filterYear" name="years" required><option value="" selected>Choose...</option>';
        
        filterString.filter(String).forEach(str => {
          filter += '<option value="'+str+'">'+str+'</option>';
        });
  
        filter += '</select><button class="btn btn-primary" type="button" id="FilterButton" onclick="filter()" >Submit</button>';

        
      }
      
      var today = new Date();
      var year = today.getFullYear();
      var month = today.getMonth();
      if (!ar.some(([a,,,d]) => {
        var t = new Date(a);
        return year == t.getFullYear() && month == t.getMonth() && d.toUpperCase() == "PAID";
        })) {
              document.getElementById("digitalgoods-030521182921-1").style.display = "block";
            }
      document.getElementById("displayRecords").innerHTML = displayTable;
      document.getElementById("firstLastName").innerHTML = "USER: " + name;
      document.getElementById("myFilter").innerHTML = filter;
      document.getElementById("LoginButton").innerHTML = "Login";
      document.getElementById("username").value = '';
      document.getElementById("password").value = '';
    }
    
    //change the link according to ur webapp latest version
    function LogOut(){  
      window.open("https://script.google.com/macros/s/AKfycbwKa4sQ441WUIqmU40laBP0mfiqNMiN-NghEvwUnJY/dev",'_top');
    }
      
    function changePassword(){
    var result = confirm("Want to Change Password?");
    if (result) {
    var newPassword = document.getElementById("newPassword").value;
    google.script.run.withSuccessHandler(() => alert('Password changed')).changePassword(username, newPassword);
    }

  }
    </script>

过滤前

过滤后

Answer 1

我对你的所有逻辑在你的代码中的位置有点模糊，但是，如果我能够确定你处理某些区域的代码行是真的......

设置一个变量来检查选择年份的按钮是否被选中，我相信是

filter += '</select><button class="btn btn-primary" type="button" id="FilterButton" onclick="filter()" >Submit</button>

这里有：onclick="filter()"

因此，如果这确实是触发显示较早年份的按钮，则将该函数中的变量设置为 false --> yearCheck = false

现在，在您定义用户变量的地方，在GetRecords() 函数上方定义变量。 var checkYear = true;

一旦你运行包含条件的代码来检查过滤器，我相信它有一个函数ar.some，你可以添加检查变量是否为假的位，&& yearCheck !== false。我相信这是您在问题中发布的第一个代码块。

if (!ar.some(([a,,,d]) => {
    var t = new Date(a);
    return year == t.getFullYear() && month == t.getMonth() && d.toUpperCase() == "PAID";
    }) && yearCheck !== false) {
          document.getElementById("digitalgoods-030521182921-1").style.display = "block";
        }

    var yearCheck = true;
    function GetRecords() {
    var spin = "<span class=\"spinner-border spinner-border-sm\" role=\"status\" aria-hidden=\"true\"></span>";
    spin += " Loading...";
    document.getElementById("LoginButton").innerHTML = spin;

    function filter(){
       var filterStr = document.getElementById("filterYear").value;
       google.script.run.withSuccessHandler(displayTable).GetRecords(username, filterStr);
       yearCheck = false;
    }


    var today = new Date();
      var year = today.getFullYear();
      var month = today.getMonth();
      if (!ar.some(([a,,,d]) => {
        var t = new Date(a);
        return year == t.getFullYear() && month == t.getMonth() && d.toUpperCase() == "PAID";
        }) && yearCheck !== false) {
              document.getElementById("digitalgoods-030521182921-1").style.display = "block";
            }

如果这不起作用，我将从您的问题线程中删除我的答案。