Javascript 搜索值，然后在谷歌工作表中查找，并使用谷歌应用程序脚本在html中显示行值_Javascript_Html_Google Apps Script_Google Sheets Api

Javascript 搜索值，然后在谷歌工作表中查找，并使用谷歌应用程序脚本在html中显示行值

javascript html google-apps-script

Javascript 搜索值，然后在谷歌工作表中查找，并使用谷歌应用程序脚本在html中显示行值,javascript,html,google-apps-script,google-sheets-api,Javascript,Html,Google Apps Script,Google Sheets Api,我有一个谷歌电子表格，它有一个用html显示用户表单的菜单。userform是一种数据输入表单，允许您将输入数据添加到google电子表格中。我添加了一个按钮，可以在谷歌电子表格中搜索ID号。以下是我的按钮和ID号的html代码： html: 顺便说一下，以下是我的电子表格数据示例： ID Number | First Name | Last Name| 101018 | John | Doe | 101011 | Jane | Doe |

我有一个谷歌电子表格，它有一个用html显示用户表单的菜单。userform是一种数据输入表单，允许您将输入数据添加到google电子表格中。我添加了一个按钮，可以在谷歌电子表格中搜索ID号。以下是我的按钮和ID号的html代码：

html:

顺便说一下，以下是我的电子表格数据示例：

ID Number | First Name | Last Name|
101018    | John       | Doe      |
101011    | Jane       | Doe      |

我试图在html用户表单中反映这些数据，方法是使用按钮搜索ID号，然后获取其行中的值。（例如，我正在搜索101018，当我单击“搜索”按钮时，它将反映用户表单中的数据。我希望任何人都能提供帮助。非常感谢。您的代码基本正确，只是：

缺少Id为“rnum”且要为其分配输出的元素。您可以定义，例如

您错过了

函数搜索配置文件

中的括号

（）

，并且与函数名存在一些冲突

工作代码代码G.gs：

index.html：

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <div class="form-row">
      <div class="form-group col-md-2">  
        <label for="idNum">ID Number</label>
        <input type="text" class="form-control" id="idNum">
        <output id="rnum"></output>
      </div>
     <button type="button" class="btn btn-outline-info" id="searchbtn">Search Profile</button>
   </div>
<script>
    document.getElementById("searchbtn").addEventListener("click", searchProfile);
   function searchProfile(){
     var appProfile = document.getElementById("idNum").value;
     if(appProfile.length === 6){
     google.script.run.withSuccessHandler(updateProfile).updateIdNum(appProfile);
     } 
     //else{
     //alert("invalid Profile Number");
     }   
   function updateProfile(returnData){
      document.getElementById("rnum").value = returnData[1];
   }
    </script>
  </body>
</html>


身份证号码
搜索配置文件
document.getElementById（“searchbtn”）.addEventListener（“单击”，搜索配置文件）；
函数searchProfile（）{
var appProfile=document.getElementById（“idNum”）.value；
如果（appProfile.length==6）{
google.script.run.withSuccessHandler（updateProfile）.UpdateInum（appProfile）；
} 
//否则{
//警报（“无效配置文件编号”）；
}   
函数更新配置文件（返回数据）{
document.getElementById（“rnum”）.value=returnData[1]；
}

感谢您指出我的错误。我已经修复了它，现在我收到了以下错误：“Uncaught TypeError:无法读取null的属性“1”。我正在尝试找到解决方案。谢谢，我认为这是从谷歌脚本返回的。记录返回的谷歌脚本返回了我需要的值，但在javascript中，当我console.log返回的数据（console.log（retData）“null”出现时。起初它是null的不可读取属性“1”，但现在它唯一的“null”刚刚意识到我为index.html粘贴了错误的代码，现在看看。

function updateProfNum(appProfile){
  //var appProfile = "101018"

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var ws = ss.getSheetByName("Results");

  var data = ws.getRange(1, 1, ws.getLastRow(), 1).getValues();
  var dJoin = data.join().split(",");
  vare myPnum = dJoin.indexOf(appProfile);
  var dataRow = ws.getRange(myPnum + 1, 1, 1, ws.getLastColumn()).getValues();


  if (myPnum > -1){
    return dataRow[0];
  } else {
    Logger.log("unknown")
    //return "unavailable";
  }

}

ID Number | First Name | Last Name|
101018    | John       | Doe      |
101011    | Jane       | Doe      |

function updateIdNum(appProfile){
  //  var appProfile = "101018"

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var ws = ss.getSheetByName("Results");

  var data = ws.getRange(1, 1, ws.getLastRow(), 1).getValues();
  var dJoin = data.join().split(",");
  var myPnum = dJoin.indexOf(appProfile);
  var dataRow = ws.getRange(myPnum + 1, 1, 1, ws.getLastColumn()).getValues();
  Logger.log(dataRow[0]);

  if (myPnum > -1){
    return dataRow[0];
  } else {
    Logger.log("unknown")
    //return "unavailable";
  } 
}


function onOpen() {
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
  .createMenu('Custom Menu')
  .addItem('Show sidebar', 'showSidebar')
  .addToUi();
}

function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile('index')
  .setTitle('My custom sidebar')
  .setWidth(300);
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
  .showSidebar(html);
}

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <div class="form-row">
      <div class="form-group col-md-2">  
        <label for="idNum">ID Number</label>
        <input type="text" class="form-control" id="idNum">
        <output id="rnum"></output>
      </div>
     <button type="button" class="btn btn-outline-info" id="searchbtn">Search Profile</button>
   </div>
<script>
    document.getElementById("searchbtn").addEventListener("click", searchProfile);
   function searchProfile(){
     var appProfile = document.getElementById("idNum").value;
     if(appProfile.length === 6){
     google.script.run.withSuccessHandler(updateProfile).updateIdNum(appProfile);
     } 
     //else{
     //alert("invalid Profile Number");
     }   
   function updateProfile(returnData){
      document.getElementById("rnum").value = returnData[1];
   }
    </script>
  </body>
</html>