Matt0'-'
Matt0'-'

Reputation: 14

Why is the search bar in my Google Apps Script failing?

I have a google apps script html sidebar that works, except the google.script.run.withSuccessHandler function:

let html = "<h1>DriveSocial</h1>\
      <input type='search' id='search'>\
      <script type='text/javascript'>\
      let searchBar = document.getElementById('search');\
      searchBar.onsearch = function() {\
      google.script.run.withSuccessHandler(showResult).withFailureHandler(fail).searchHashTags(searchBar.value);\
      }\
      function showResult(html) {\
        document.write(html);\
      }\
      function fail() {\
      alert('error');\
      }\
      </script>";

The document never rewrites itself.

the searchHashTags function is fully debugged, I tried just searchBar instead of searchBar.value, but it still wouldn't return. Even the failure handler didn't say anything.

function searchHashTags(hashtag) {
  let returnV = "";
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var sheet = ss.getSheets()[0];
  var values = sheet.getSheetValues(2, 1, -1, -1);
  // Get the hastags from each row.
  for(value of values) {
    let hashtags = value[3].replaceAll(" ", "").split(","); // Split up the list of hashtags
    for(hashtag2 of hashtags) {
      if(hashtag2 == hashtag) { // and check each one.
        var id = getFileIdFromUrl(value[1]);
        returnV += "<article>\
          <h2>"+value[4]+"</h2>"
          returnV += 'File type: <b>'+DriveApp.getFileById(id).getMimeType()+'</b><br><iframe src="https://drive.google.com/file/d/'+id+'/preview" width="640" height="480" allow="autoplay"></iframe>';
          returnV += "<p>"+value[3]+"</p>\
          <p>Made by <a href='mailto:"+value[2]+"'>"+value[2]+"</a> at "+value[0]+"</p>\
          </article>";
      }
    }
  }
  return returnV;
}

Upvotes: -1

Views: 31

Answers (1)

Cooper
Cooper

Reputation: 64130

This works:

html:

<!doctype html>
<html lang="en">
<head>
  <title>Title</title>
</head>
<body> 
<h1>DriveSocial</h1>
      <input type="search" id="search" onChange="change();">

      <script>
        function change(){
          let searchBar = document.getElementById("search");
          searchBar.onsearch = google.script.run.withSuccessHandler(showResult).withFailureHandler(fail).searchHashTags(searchBar.value);
        }
        function showResult(v) {
          console.log(v);
          document.getElementById("search").value ="";
        }
        function fail() {
          alert("error");
        }
      </script>
</body>
</html>

gs:

function mytestsidebar() {
  SpreadsheetApp.getUi().showSidebar(HtmlService.createHtmlOutputFromFile('ah4'));
}

function searchHashTags(value) {
  return value + " return ";
}

Upvotes: 1

Related Questions