はじめに
この記事は「Ateam LifeDesign Advent Calendar 2023」で完走賞を狙って25記事書いているうちの25日目の記事です。ようやく完走・・・!!
GASの書き方は今まで色々みてきたので、今日はスプレッドシート上からGASを実行する方法をいくつかご紹介します。今回はあらかじめhogeFunction()
を作っておいてそれを実行していきます。
function hogeFunction() {
SpreadsheetApp.getUi().alert('Hello, world');
}
メニューから実行する
新たにメニューを追加する
昨日の記事で触れたメニューを追加して、そこから関数を実行する方法です。
function onOpen(e) {
SpreadsheetApp.getUi()
.createMenu('My Menu')
.addItem('My menu item', 'hogeFunction')
.addToUi();
}
このようにしておくことでメニューに追加された「My menu item」をクリックすることでhogeFunctionを動かすことができます。
マクロに追加する方法
「拡張機能」→「マクロ」から「マクロをインポート」を選択します。
するとGASに書いてある関数が一覧で表示されるので実行したいものの「関数を追加」をクリックします。
もう一度「拡張機能」→「マクロ」を見ると先程選択した関数が追加されていることが確認できます。このhogeFunctionのメニューをクリックすることで関数を実行することができます。
ボタンを配置してボタンを押すことで実行する
シート内に任意のボタンを配置して、そのボタンを押すことで関数を実行する方法を見ていきます。まず「挿入」→「図形描画」をクリック。
好きな図形を作ったら「保存して終了」を押します。
配置された図形の右上にある三点リーダーをクリックすると「スクリプトを割り当て」というのが出てくるのでここをクリック。
実行したい関数名を記入したら「確定」を押します。
これでこの図形をクリックされると関数が実行されるようになります。
サイドバーに実行ボタンをhtmlで配置する
昨日の記事で触れたサイドバーにボタンを配置してクリックすることで実行するようにする方法です。
createHtmlOutput
のなかにはhtmlを書くことが出来るのでそこでhtmlでボタンを作成しonclickイベントで関数が呼び出されるようにしていきます。
function onOpen(e) {
let template = HtmlService.createTemplateFromFile('sidemenu');
let htmlOutput = template.evaluate();
htmlOutput.setTitle('サイドバーのタイトル');
SpreadsheetApp.getUi().showSidebar(htmlOutput);
}
今回はhtmlファイルを別途sidemenu.htmlとして作成して、それを呼び出す形で使用しています。template.evaluate()
で指定されたファイルのhtmlを取得します。この段階では、まだサイドバーには表示されていません。htmlOutput.setTitle('サイドバーのタイトル')
でサイドバーのタイトルを設定します。
showSidebar()
メソッドを使用して、作成したhtmlを含むサイドバーを実際に表示します。このコードが実行されると、サイドバーが表示されます。
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script>
function hogeFunction(){
google.script.run.hogeFunction();
}
</script>
</head>
<body>
<button onclick="hogeFunction()">hogeFunctionを実行する</button>
</body>
</html>
html側はこんな感じです。<button>
タグでボタン要素を定義し、onclick
イベントにhogeFunction()
を関連付けます。こうすることでボタンがクリックされると、この関数が実行されるようにしています。hogeFunction()
内ではgoogle.script.run
を使ってサーバーサイドのhogeFunction()
(つまりコード.gsで定義しているhogeFunction()
)を実行します。これにより、クライアント側からサーバーサイドのGASの関数を呼び出すことができるようになります。
完成するとこのような画面になります。サイドバーにボタンが表示されており、ここをクリックすることで関数を実行することができます。
最後に
今回はスプレッドシートからGASを実行する方法についていくつかみていきました。簡単にできるものからちょっとコードを書く必要があるものまでありますが、用途に応じて適切なものを選んで、より使いやすいものを作っていきましょう。