Pass a variable from web app and display dialog

Question

I am trying to pass a searchterm from a google web app to display the results. I am having trouble on submission I receive a blank screen. When the form is submitted, I would like it to display the results. The main code works within the logger- now I am just working on the UI and getting the form to work.

Any help is appreciated!

So far this is the code I have:

CODE:

function SearchFiles() {
//Please enter your search term in the place of Letter
var searchterm ="'mysearchinput'";  \\ this would be the variable that is passed from the form on index.html
var searchFor ="title contains " + searchterm;
var owneris ="and '[email protected]' in Owners";
var names =[];
var fileIds=[];
var files = DriveApp.searchFiles(searchFor + owneris);
while (files.hasNext()) {
  var file = files.next();
  var fileId = file.getId();// To get FileId of the file
  fileIds.push(fileId);
  var name = file.getName();
  names.push(name);

}

for (var i=0;i<names.length;i++){
Logger.log(names[i]);
Logger.log("https://drive.google.com/uc?export=download&id=" + fileIds[i]);

}

}

function doGet() {
return HtmlService.createHtmlOutputFromFile('index');
}

function processForm(formObject) {
Logger.log('I was called!');
 // here is where I would like to display results of searthterm.
}

HTML:

 <!DOCTYPE html>
 <html>
 <head>
 <base target="_top">
      <script>
    function handleFormSubmit(formObject) {
    google.script.run.withSuccessHandler(updateUrl).processForm(formObject);
  }
    function onFailure(error) {
    var div = document.getElementById('output');
    div.innerHTML = "ERROR: " + error.message;
  }
 </script>
 </head>
 <body>
 Hello, World!
 <form id="myForm" onsubmit="handleFormSubmit(this)">
  <input type="text" name="search">
  <input type="submit" value="Submit" />

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

SEARCH FUNCTION:

function SearchFiles() {
  Logger.log('I Searched Files');
  //Please enter your search term in the place of Letter
  var searchterm ="'Whatevertextisinthesearchbox'";
  var searchFor ="title contains " + searchterm;
  var owneris ="and 'Youremail@yourdomain' in Owners";
  var names =[];
  var fileIds=[];
  var files = DriveApp.searchFiles(searchFor + owneris);
  while (files.hasNext()) {
    var file = files.next();
    var fileId = file.getId();// To get FileId of the file
    fileIds.push(fileId);
    var name = file.getName();
    names.push(name);

  }

  for (var i=0;i<names.length;i++){
  //  Logger.log(names[i]);
  //  Logger.log("https://drive.google.com/uc?export=download&id=" + fileIds[i]);
    var filesreturned = {
      name:names[i],
      urls:"https://drive.google.com/uc?export=download&id=" + fileIds[i]
     
    }
     Logger.log(filesreturned.name + " - " + filesreturned.urls);
     return(filesreturned);
  }

}

What type of UI do you want? Do you want to do something using html javascript? Or you want to show something in spreadsheets? If you want UI in html javascript, then write the code in index file's <div> tag and then change its display from block to none and vice-versa. You won't be able to do so with appscript function. But using appscript function, you can write in spreadsheet. So, which solution are you looking for and where are you stuck at? — Shyam Kansagra
– Shyam Kansagra, Commented Jan 19, 2017 at 4:58
Hi thanks, this is a web based app only- not tied to any spreadsheet. This is the part I am having trouble with. I don't see any errors on submitting the button only a white screen. And I have tried different techniques but must be missing something. Could you show me what I could write even to get "hello world" to show up on button press. — OblongMedulla
– OblongMedulla, Commented Jan 19, 2017 at 14:17

Shyam Kansagra · Accepted Answer · 2017-01-20 05:20:56Z

1

As per your comment above, here is the code to simply show hello world on button click. For your reference, I have also added a code to pass data between javascript and appscript.

Index.html file

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
    <script>
    function displayMessage()
    {
    google.script.run.withSuccessHandler(helloWorld).parseDataFromAppscript();
    }

    function helloWorld(stringText)
    {
    document.writeln(stringText);    
    }
    </script>
  </head>
  <body>
    <input type="button" value="submitButton" name="submitButton" onclick="displayMessage()"/>    
  </body>
</html>

Code.gs file

function doGet(e) {
  var template = HtmlService.createTemplateFromFile('Index');
  return template.evaluate()
      .setTitle('Hello World')
      .setSandboxMode(HtmlService.SandboxMode.IFRAME);
}

function parseDataFromAppscript()
{
  return "Hello World!";
}

To run this, go to publish -> deploy as web app -> update. And then click latest code.

If you want explanation for any part, please feel free to ask. I'm assuming you already know html javascript and google.script.run method. :)

answered Jan 20, 2017 at 5:20

Shyam Kansagra

92212 silver badges25 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

OblongMedulla Over a year ago

Thanks, this works- I see I am trying to use a search box and it continues to give me a white screen. So it appears that is part of the problem as well. I will add the function up above that I am trying to run when a text is inserted into the box, perhaps you can help with this part as well?

Collectives™ on Stack Overflow

Pass a variable from web app and display dialog

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related