Skip to content

Commit 348af02

Browse files
Merge pull request #87 from contributorpw/edits
Open dialog from sidebar
2 parents 4ff9159 + b6355ac commit 348af02

File tree

9 files changed

+109
-0
lines changed

9 files changed

+109
-0
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Document</title>
8+
</head>
9+
<body>
10+
<div>Hi!</div>
11+
<div>I'm the dialog</div>
12+
</body>
13+
</html>
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
/**
2+
* Opens the sidebar
3+
*/
4+
function openSidebarDialog() {
5+
SpreadsheetApp.getUi().showSidebar(
6+
HtmlService.createHtmlOutputFromFile('app/sidebar.html')
7+
);
8+
}
9+
10+
/**
11+
* Opens the modal dialog
12+
*/
13+
function showModalDialog() {
14+
SpreadsheetApp.getUi().showModalDialog(
15+
HtmlService.createHtmlOutputFromFile('app/dialog.html'),
16+
'Modal dialog'
17+
);
18+
}
Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Document</title>
8+
</head>
9+
<body>
10+
<a href="#" id="btnShowModalDialog">Show the modal dialog</a>
11+
<script>
12+
document.addEventListener('DOMContentLoaded', (e) => {
13+
document
14+
.getElementById('btnShowModalDialog')
15+
.addEventListener('click', (e) => {
16+
e.preventDefault();
17+
google.script.run.showModalDialog();
18+
});
19+
});
20+
</script>
21+
</body>
22+
</html>
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"timeZone": "Europe/Moscow",
3+
"dependencies": {},
4+
"exceptionLogging": "STACKDRIVER",
5+
"runtimeVersion": "V8"
6+
}
Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"type": "container-bound-sheet",
3+
"src": []
4+
}
Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
---
2+
title: 'Open an dialog from the sidebar'
3+
date: '2021-08-27'
4+
description: 'The snippet demonstrates how to open additional UI elements in Google Sheets.'
5+
tags: ['common_ui']
6+
categories: ['snippets']
7+
---
8+
9+
## Open an dialog from the sidebar
10+
11+
{{< toc >}}
12+
13+
<video controls width="100%" height="350px" autoplay="true" loop="true">
14+
<source src="./screenrecord.mp4" type="video/mp4">
15+
Sorry, your browser doesn't support embedded videos.
16+
</video>
17+
18+
- {{< externalLink >}}
19+
- {{< commentLink >}}
20+
- {{< scrvizLink >}}
21+
22+
### The main code
23+
24+
{{< codeFromFile "app/sidebar.html" >}}
25+
{{< codeFromFile "app/index.js" >}}
26+
27+
### Run it
28+
29+
{{< codeFromFile "run.js" >}}
30+
31+
{{< clipboard >}}
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
/**
2+
* Runs the snippet
3+
*/
4+
function run() {
5+
openSidebarDialog();
6+
}
Binary file not shown.
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
/**
2+
* Create menu for handy use
3+
*/
4+
function onOpen() {
5+
SpreadsheetApp.getUi()
6+
.createMenu('Apps Script Snippets')
7+
.addItem('Open sidebar', 'run')
8+
.addToUi();
9+
}

0 commit comments

Comments
 (0)