Question 228065 in Javascript Question posted in
A very good W3school tutorial can be found here.

Javascript – pass data from the server side to the GAS client side

I have a function for a web app that makes copies of templates, as parameters it receives the name of the template and the id of the template.

CODE.gs

function generate_(idTemplate, name) {

 var template = DriveApp.getFileById(idTemplate);
 var folder = 'folder id';

var copyName = name + "-" + CurrentDate;// the date on which it was created is added
  var copy;
  try {
    copy = template.makeCopy(copyName, folder);
  } catch (e) {
    Logger.log(e.stack);
  }
var nameF = copy.getName();
var linkF = copy.getUrl()
Logger.log(nameF,linkF)
  return getFile(nameF,linkF) //these values are the ones i want passed to the client side.
}

This function is the one that im using to pass the copy name and url to the client side. I understand that in js to return multiple parameters you have to do it through an array.

function getFile(nameF,linkF){
var array = [nameF,linkF];
return array;
}

This is the client-side script I use to try to retrieve that generated copy data:

HTML

<script>
        function getValues(){
          google.script.run.withSuccessHandler(copyValues).getFile();
        }
        function copyValues(values){
         
          var nameF = values[0];
          var urlF = values[1];
        console.log(values);
         console.log(nameF);
          console.log(urlF);
          console.log("values were passed successfully,");
        }
    </script>

I am using a button to test if it is passed correctly, however I am unable to display this data, the browser console shows me null on the logs.

what I could be doing wrong? , i already tried google.script.run.withSuccessHandler(copyValues).getFile(nameF,linkF); in the client side
but did not work.

<button id="btn" onclick="create(); getValues();"

this is the button, it triggers both create(),the script that creates the copies and getValues(); the script that gets the name and url of that copy. the template copies are created successfully but the file name and url are not retrived to the client side.

Tags:

2

Answers


  1. 0

    Here is an example of how to get the file info.

    As shown in the following screenshot, when I click the button the name and url are shown in the input field.

    enter image description here

    Code.gs

    function showTest() {
  setFileInfo();
  let html = HtmlService.createHtmlOutputFromFile("HTML_Test");
  SpreadsheetApp.getUi().showModalDialog(html,"Test");
}

function setFileInfo() {
  let id = "1xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxE";
  let name = "Copy of Template";
  let template = DriveApp.getFileById(id);
  let copy = template.makeCopy(name);

  let properties = PropertiesService.getDocumentProperties();
  let property = [copy.getName(),copy.getUrl()];
  properties.setProperty("FileInfo",JSON.stringify(property));
}

function getFileInfo() {
  let properties = PropertiesService.getDocumentProperties();
  let property = properties.getProperty("FileInfo");
  if( property ) {
    return JSON.parse(property);
  }
  return "Error";
}

    HTML_Test.html

    <!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <input id="getFileInfoButton" type="button" onclick="getFileInfoClicked()" value="Get File Info"><br>
    <input id="getFileInfoText" type="text">
    <script>
      function getFileInfoClicked() {
        try {
          google.script.run.withSuccessHandler( 
            function (value) {
              document.getElementById("getFileInfoText").value = value;
            }
          ).getFileInfo();
        }
        catch(err) {
          alert(err);
        }
      }
    </script>
  </body>
</html>
    Login or Signup to reply.
  2. 0

    Try this:

    GS:

    function launchmydialog() {
  let t = HtmlService.createTemplateFromFile("ah2");
  t.t1 = "one";
  t.t2 = "two";
  SpreadsheetApp.getUi().showModelessDialog(t.evaluate(),"Dialog");
}

    HTML:

    <!DOCTYPE html>
<html>
<head>
  <base target="_top">
</head>
<body>
    <input type="text" id="txt1" name="text1" value="<?= t1 ?>" /><br>
    <input type="text" id="txt2" name="text2" value="<?= t2 ?>" /><br>
</body>
</html>

    Dialog:

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search