Creating custom search in Google Sheets sidebar

Question

I have a sheet that has approximately 1400 rows to track parking spaces for a parking garage. So far, with help, I have been able to open the sidebar, create a search box, and add "Search" and "Close" buttons. Right now once the "Search" button is clicked it looks like it is not grabbing the space number in the search box, also not communicating with the script.

My question is how can I get the information out of the search box, look through column B for a match, grab the information from columns BG in that row, and return the information in the following format:

• Column B: colBInfo
• Column C: colCInfo
• Column D: colDInfo
• Column E: colEInfo
• Column F: colFInfo
• Column G: colGInfo
• Row Number: rowNumInfo

I have done a debug and fund that Function searchInfo is giving the error: The coordinates or dimensions of the range are invalid. (line 28, file "Sidebar") because rowWithSpaceNumber is returning -1. I believe once theSpaceNumber is able to get the information out of the search box it will correct this error.

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);
SpreadsheetApp.getActiveSpreadsheet().toast('Sidebar opened', 'Status');
}

function searchInfo(theSpaceNumber) {
 var ss =     SpreadsheetApp.openById("1isuunf_SRThXe8C71ROKAC2JvjZ49w05MrLE2323Yqk");
Logger.log("Book name: "+ ss.getName());
var sheetWithData = ss.getSheetByName("Master Sheet");
Logger.log("Sheet name: "+ sheetWithData.getName());  
var numOfRowsInSheet = sheetWithData.getLastRow();
var values = sheetWithData.getSheetValues(4, 2, numOfRowsInSheet, 1);
Logger.log("Values: "+ values);


//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(theSpaceNumber);
Logger.log("rowWithSpaceNumber: " + theSpaceNumber);

//Get 6 columns of data:  getSheetValues(startRow, startColumn, numRows, numColumns)
var colBInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 2, 1, 1);
var colCInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 3, 1, 1);
var colDInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 4, 1, 1);
var colEInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 5, 1, 1);
var colFInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 6, 1, 1);
var colGInfo = sheetWithData.getSheetValues(rowWithSpaceNumber, 7, 1, 1);
var rowNumInfo = sheetWithData.getRange(rowWithSpaceNumber, 2);
Logger.log("Row Number: " + rowWithSpaceNumber);

return app ( colBInfo, colCInfo, colDInfo, colEInfo, colFInfo, colGInfo, rowNumInfo );    

};

index.html

<div>

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

<BR>

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

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


<script> 

function onSuccess( colBInfo, colCInfo, colDInfo, colEInfo, colFInfo, colGInfo, rowNumInfo) {


  alert('Column B: ' + colBInfo
    <br>'Column C: ' + colCInfo
    <br>'Column D: ' + colDInfo
    <br>'Column E: ' + colEInfo
    <br>'Column F: ' + colFInfo
    <br>'Column G: ' + colGInfo
    <br>'Row Number: ' + rowNumInfo

    );
}

function getUserInput() {
var theSpaceNumber = document.getElementById("idUserInput").value;

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

</script>

</div>

Answer 1

According to me, there are two reasons for failing this.

First, the reason for showing -1 is that it's not finding the passed value in your spreadsheet.

Second, data type of your passed value will be string , and data type of your values in theRowValues is object . So, it always fail even if you pass the data available in the spreadsheet because of having two different types while being compared.

To solve this type error,

Change theRowValues.push(values[i]) with following line in your sidebar.gs ,

theRowValues.push(Utilities.formatString("%s", values[i]));

This will convert your spreadsheet data from object data type to string data type.

After doing this, you will still have to handle the error in your spreadsheet.

Imagine, if you have passed the data which is not available in your spreasdheet, your code will return value -1 for the rowWithSpaceNumber , which is going to result in error at var theRowData = sheetWithData.getSheetValues(rowWithSpaceNumber, 2, 1, 6); as -1 is not a valid value for row.