在 Google 表格边栏中创建搜索

Question

我有一个 sheet 可以跟踪大约 1400 个停车 spaces 并且想在边栏中添加一个单独的搜索。我已经能够通过自定义菜单点击显示侧边栏。在边栏中，我已经能够重命名它，添加一个搜索栏，并在栏下方添加搜索和关闭按钮。

我现在需要帮助，一旦用户在搜索栏中输入 space 号码并单击“搜索”，它将获取 space 号码，查看 B 列并收集以下信息从该行和 return 到以下格式的边栏：

B 列：'Return Column B information'
C 列：'Return Column C information'
D 列：'Return Column D information'
E 列：'Return Column E information'
F 列：'Return Column F information'
G 列：'Return Column G information'
行号：'Return Row number that information is in'

下面是我现在拥有的代码。

Menu.gs

function onOpen() { 

SpreadsheetApp.getUi()
.createMenu('Sidebar')
.addItem('Show Sidebar', 'showSidebar')
.addToUi(); 
}

Sidebar.gs

function showSidebar() {
var html = HtmlService.createHtmlOutputFromFile('index')
  .setSandboxMode(HtmlService.SandboxMode.IFRAME)
  .setTitle('Individual Space Lookup');
SpreadsheetApp.getUi()
  .showSidebar(html);
}

function searchInfo() {

return ('test');    

}

index.html

<div>

Search Individual Space: <input type="search" />

<BR>

<input type="button" value="Search"
onclick="google.script.run.onSuccess()" />

<input type="button" value="Close"
onclick="google.script.host.close()" />

<script> 

function onSuccess(searchInfo) {

alert('Column B: ' + searchInfoColB
    <br>'Column C: ' + searchInfoColC
    <br>'Column D: ' + searchInfoColD
    <br>'Column E: ' + searchInfoColE
    <br>'Column F: ' + searchInfoColF
    <br>'Column G: ' + searchInfoColG
    <br>'Row Number: ' + searchInfoRowNum

    );
}

google.script.run.withSuccessHandler(onSuccess)
  .searchInfo(); 

</script>
</div>

Answer 1

您的第一个输入标签应该有一个 "id" 属性。这是为了检索输入值。

Search Individual Space: <input type="search" id="idUserInput"/>

您的按钮输入标签配置错误。你有：

<input type="button" value="Search"
  onclick="google.script.run.onSuccess()" />

应该是：

<input type="button" value="Search"
  onclick="myFunction()" />

您有一个带有 onSuccess 函数的 SCRIPT 标记，然后使用 google.script.run 调用 Google 服务器函数。现在，您正在两个地方调用服务器代码。

您的 SCRIPT 标签只有一个功能，需要两个：

<script>

  function onSuccess() {
    alert('Column B: ' + searchInfoColB
      <br>'Column C: ' + searchInfoColC
      <br>'Column D: ' + searchInfoColD
      <br>'Column E: ' + searchInfoColE
      <br>'Column F: ' + searchInfoColF
      <br>'Column G: ' + searchInfoColG
      <br>'Row Number: ' + searchInfoRowNum
    );
  };

  function myFunction() {
    //Get the space number out of the input field
    var theSpaceNumber = document.getElementById("idUserInput").value;

    google.script.run.withSuccessHandler(onSuccess)
      .searchInfo(theSpaceNumber); 
  };

</script>

将停车 Space 号码传递给 gs 函数

//Get the space number out of the input field
var theSpaceNumber = document.getElementById("idUserInput").value;

google.script.run.withSuccessHandler(onSuccess)
  .searchInfo(theSpaceNumber);

以上代码用于您的 SCRIPT 标记中的客户端代码。添加行以从输入框中获取 space 数字，并将 theSpaceNumber 变量放入函数调用中。 .searchInfo(theSpaceNumber);

以下是如何启动服务器端代码的概述：

获取您要访问的点差sheet的参考：

var ss = SpreadsheetApp.openById("theSpreadsheet ID");
//Logger.log(ss.getName());

获取对您需要访问的 sheet 的引用：

var sheetWithData = ss.getSheetByName("Sheet Name Here");

获取要经过的行数：

var numOfRowsInSheet = sheetWithData.getLastRow();

所以，到目前为止你会得到这个：

function searchInfo(argSpaceNumber) {
  var ss = SpreadsheetApp.openById("theSpreadsheet ID");
  //Logger.log(ss.getName());
  var sheetWithData = ss.getSheetByName("Sheet Name Here");
  var numOfRowsInSheet = sheetWithData.getLastRow();

  return ('test');    
};

现在您需要确定获取初始数据的最佳方式是什么。您是要获取一大块数据，还是逐个单元格地筛选数据？好吧，您需要的所有数据都在连续的列中，这样更容易。而且你只会得到一行数据，这样就更容易了。但问题是，什么parkingspace与什么行相关联？我假设您在 A 列中有停车 space 号码。因此您需要找到停车 space 号码所在的行号。

获取 A 列中的所有数据

var values = sheetWithData.getSheetValues(1, 1, numOfRowsInSheet, 1);
Logger.log(values);

在 A 列中找到 Space 数字

//Convert two dimensional array to one dimensional array.
var theRowValues = [];

for (var i = 0; i < values.length; i++) {
   theRowValues.push(values[i]);
};

var rowWithSpaceNumber = theRowValues.indexOf(argSpaceNumber.toString());
Logger.log("rowWithSpaceNumber: " + rowWithSpaceNumber);

获取行外的所有值

//Get 6 columns of data:  getSheetValues(startRow, startColumn, numRows, numColumns)
var theRowData = sheetWithData.getSheetValues(rowWithSpaceNumber, 2, 1, 6);

进行这些更改，测试和调试代码，如果有任何错误，post 另一个带有错误消息的问题，and/or 返回的结果和预期的结果。

使用 debug and/or Logger.log() 语句调试您的代码。

在 Google 表格边栏中创建搜索

Creating a search in Google Sheets Sidebar

html

sidebar

google-sheets

google-apps-script