谷歌脚本：HTML表单浏览电子表格上的记录 - 不工作答案

【问题标题】：Google Script : HTML form navigates through the records on Spreadsheet - Not working谷歌脚本：HTML表单浏览电子表格上的记录 - 不工作
【发布时间】：2020-10-03 07:35:49
【问题描述】：

function getList() {
  var ss= SpreadsheetApp.getActiveSpreadsheet();
  var recordSheet = ss.getSheetByName("CONTACTS");
  var getLastRow = recordSheet.getLastRow();
  return recordSheet.getRange(2,1,getLastRow - 1,6).getValues();
}

function startForm(){

var form = HtmlService.createHtmlOutputFromFile('Records').setTitle('Records');
SpreadsheetApp.getUi().showSidebar(form);

}

function addMenu()
{
var menu = SpreadsheetApp.getUi().createMenu('Custom');
  menu.addItem('Dropdown Form', 'startForm');
  menu.addToUi();
}

function onOpen(e)
{
addMenu();
}

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
 
   <script> 
    function loadRecords(record){
    google.script.run.withSuccessHandler (function(ar)
    {
    var record = document.getElementById ("record").value;
    
    consule.log(ar);
    consule.log(record);
    
    var recordCount = 0;
    
    ar.forEach(function(item,index)
    {
    if(index == record - 1)
    {
    document.getElementById("firstname").value = item[0];
    document.getElementById("lastname").value = item[1];
    document.getElementById("street").value = item[2];
    document.getElementById("city").value = item[3];
    document.getElementById("state").value = item[4];
    document.getElementById("zip").value = item[5];
    
    }
    recordCount++;
    });
    
    console.log(recordCount);
    document.getElementById("maxRecord").value = recordCount;
   
   }).getList(); 
   
   }
   
      
  function NextRecord()
   {
   var record = document.getElementById("record").value;
   var maxRecord = document.getElementByID("maxRecord").value;
   var nextRecord = Number(record) + 1;
   if(nextRecord <== maxRecord)
   {
   document.getElementById("record").value = nextRecord;
   loadRecords();
   }
   }
  
   function PreviousRecord()
   {
   var record = document.getElementById("record").value;
   var previousRecord = Number(record) - 1;
   if (previousRecord >= 1)
   {
   document.getElementById("record").value = previousRecord;
   loadRecords();
   }
   }
     
   
  </script> 
   
  </head>
  <body>
    First Name: <input type="text" id="firstname" /><br>
    Last Name: <input type="text" id="lastname" /><br>
    Street: <input type="text" id="street" /><br>
    City: <input type="text" id="city" /><br>
    State: <input type="text" id="state" /><br>
    Zip: <input type="text" id="zip" /><br>
    
    <input type="button" value="<" onclick= "PreviousRecord()" />
    <input type="text" value="1" id= "record" size = "2px" />
    <input type="hidden" id="maxRecord" />
    <input type="button" value=">" onclick="NextRecord()" />
    <script> loadRecords();</script> 
    
  </body>
</html>

大家好，

我尝试制作一个可以浏览谷歌电子表格记录的 HTML 表单。我能够在电子表格上获取 HTML 表单，但电子表格上的记录未显示在 HTML 表单上。你能帮我告诉我我做错了什么吗？非常感谢您的帮助。

enter image description here

【问题讨论】：

标签： javascript html forms google-apps-script google-sheets

【解决方案1】：

您的 javascript 代码中有一些错误。

document.getElementById 是正确的用法。您的 ID 中有一个大写的“D”。
小于或等于只需要一个等号。 'this page 上查看所有可用于 Javascript 的逻辑运算符的列表。

为了轻松调试 javascript 问题，您可以在浏览器中打开文件并使用开发人员工具 (F12)。如果有任何错误，它们将显示在控制台选项卡上，并带有确切的行号以及错误的详细信息。

【讨论】：

感谢 Adarsh 帮我扫描代码。我还发现我输入了 consule 而不是 console。在浏览器中打开文件是什么意思？如何将脚本保存到文件中并在浏览器上打开？该脚本保存在 Google 电子表格中。
如果你看它的大部分内容，它只是一个简单的 html 文件，在浏览器中打开时会表现得像一个。它可能无法按预期工作，但至少可以轻松捕获语法错误。您可以将到的所有内容保存在 html 文件中，然后在浏览器中打开。