CODEWITHSUNDEEP
google-apps-scriptweb-applications
0xh8h
0xh8h

Reputation: 3509

How to detect dialog is closed

I need to detect when a dialog is closed in Apps Script (when users click the X button in the top right of the dialog)

I tried this method but it doesn't work

window.addEventListener('beforeunload', function (e) {
    e.preventDefault();
    google.script.host.close()
});

So how to do that? Thank you.

Upvotes: 3

Views: 1774

Answers (3)

Jimmy Li
Jimmy Li

Reputation: 81

This question is a duplicate of this one. As mentioned by Henrique in that post, this isn't possible on the client-side, you can only listen on the server-side for regular calls from the client to see if the dialog is closed or not.

When I tried to do this with client-side event handlers, window: onload/beforeload and document: visibilitychange event handlers were both unreliable at detecting closing of the dialog.

Upvotes: -1

ziganotschka
ziganotschka

Reputation: 26836

  • Your question concerns the closure of a custom modal dialog
  • This kind of dialog is defined in the html part of your script and runs client-side
  • This means that to detect the closure of such a dialog, you need to implement a client-side event listener - i.e. Javascript methods
  • A possibility would be to use a window event handler with the event window.unload

Sample:

Code.gs

function onOpen() {
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .createMenu('Custom Menu')
      .addItem('Show dialog', 'showDialog')
      .addToUi();
}

function showDialog() {
  var html = HtmlService.createHtmlOutputFromFile('index')
      .setWidth(400)
      .setHeight(300);
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .showModalDialog(html, 'My custom dialog');
}

index.html

<html>
  <head>
    <base target="_top">
  </head>
  <body>
  Hello, world! <input type="button" value="Close" onclick="google.script.host.close()" />
 <script> 
 window.addEventListener("unload", function() {console.log("It works"); });
 </script>
  </body>
</html>

Note: The event listener in the sample will notice when the user closes the dialog, however it cannot detect the difference between closing by pressing the X and pressing the CLOSE button.

Upvotes: 1

Sourabh Choraria
Sourabh Choraria

Reputation: 2331

Please refer to any of the sample code snippets provided in this documentation.

Here's an example if you're using a Yes_No ButtonSet in an alert box -

function onOpen() {
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
      .createMenu('Custom Menu')
      .addItem('Show alert', 'showAlert')
      .addToUi();
}

function showAlert() {
  var ui = SpreadsheetApp.getUi(); // Same variations.

  var result = ui.alert(
     'Please confirm',
     'Are you sure you want to continue?',
      ui.ButtonSet.YES_NO);

  // Process the user's response.
  if (result == ui.Button.YES) {
    // User clicked "Yes".
    ui.alert('YES - Confirmation received.');
  }  else if (result == ui.Button.NO) {
    // User clicked "No".
    ui.alert('NO - Confirmation received.');
  } else if (result == ui.Button.CLOSE) {
    // User clicked X in the title bar.
    ui.alert('You closed the prompt.');
  }
}

Hope this helps.

Upvotes: 0

Related Questions