SlackOverthrow
SlackOverthrow

Reputation: 7

How do I run an Apps Script function from an HTML dialog box?

Edited: It all works now, I just tried running it using Edge instead of Chrome and it worked for whatever reason. Thanks to everyone who responded!

I am trying to make a script using Google Apps Script that writes to the next line of a Google Sheet using a button in a custom dialog box. I decided to take this approach because I need to manually process a large amount of data, and creating a dialog box with some checkboxes in a Google Sheet is the way my team decided to go.

My issue seems to be that using google.script.run.writeToSheet() is not working correctly. The My Executions tab shows that writeToSheet fails every time it is called, but when I call writeToSheet in the onOpen function it works as intended. Am I using google.script.run incorrectly or something?

Here is my Apps Script code:

function onOpen() {
  writeToSheet();
  var ss = SpreadsheetApp.getActiveSpreadsheet();
  ss.addMenu("Detection", [{name: "Detection", functionName: "showDialog"}])
}

function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('Index')
      .setWidth(500)
      .setHeight(450);
  SpreadsheetApp.getUi().showModalDialog(html, "Marine Mammal Detection");
}

function writeToSheet() {
  var curSheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var lastRow = curSheet.getLastRow();
  var cellRange = "D"+String(lastRow+1)+":G"+String(lastRow+1);
  curSheet.getRange(cellRange).setValues([['g', 'g', 'g', 'g']]);
}

And here is my HTML:

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <input type="button" value="Submit" onclick="addDetection()"/>
    <script>
      function onFailure(error) {
        google.script.host.close();
      }

      function onSuccess(error) {
        //google.script.host.close();
      }

      function addDetection() {
        google.script.run.withSuccessHandler(onSuccess).withFailureHandler(onFailure).writeToSheet();
        //google.script.host.close();
      }
    </script>
  </body>
</html>

Upvotes: 0

Views: 179

Answers (1)

Cooper
Cooper

Reputation: 64100

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <input type="button" value="Submit" onclick="addDetection();"/>
    <script>
      function addDetection() {
        google.script.run.writeToSheet();
      }
    </script>
  </body>
</html>

GS:

function writeToSheet() {
  const sh = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  sh.getRange(sh.getLastRow() + 1 , 1, 1, 4).setValues([[1,2,3,4]]);
}

Try this and suppy comma separated values:

function writeToSheet(v) {
  const sh = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  sh.getRange(sh.getLastRow() + 1 , 1, 1, v.length).setValues([v]);
}

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <input type="text" id="txt1" />
    <input type="button" value="Submit" onclick="addDetection();"/>
    <script>
      function addDetection() {
        let v = document.getElementById('txt1').value.split(',');
        google.script.run.writeToSheet(v);
      }
    </script>
  </body>
</html>

Upvotes: 0

Related Questions