GoogleスプレッドシートとGoogles Appps Script (GAS) を使ったテーブル形式フォームは少しの変更でさまざまなアプリになります。たとえば、ドロップダウンで項目選択できる様にし、日別にシートが作られる様にして、家計簿アプリを作ってみましょう。
ここで、GoogleAppsScriptの素晴らしい点の1つは、JavaScript のライブラリをCDNという形で組み込んで使える点です。世の中にはJavaScript のオープンソースが沢山ありますので、これは大変ありがたい機能です。
テーブルに組み込まれたドロップダウン要素にアクセスするのはなかなか面倒なのですが、JQueryというライブラリを組み込んで使うと、これが簡単になります。
ネット上でも似たアプリはたくさん見かけますが、生活の形態は一人ひとり違うので、自分の生活に合った1つだけのアプリを作る魅力も捨てがたいと思います。ご紹介する家計簿は本当に簡素な「ひな型」ですので、宜しければ自分だけのアプリにチャレンジしてみてください。
目次
「テーブル形式フォーム」に、「日別シート」「プルダウン」の機能を組み込んだ「家計簿アプリ」を作ろう。
以下の記事を順に追っていただくと、GoogleスクリプトとGoogleスプレッドシートを使用して、家計簿アプリを作る方法が分かります。
「テーブル形式フォーム」を基本としつつ、日別シートを追加する機能と、プルダウンをテーブル中に埋め込んで読み書きする機能を実装しています。また、プルダウンへのアクセスにJQueryというオープンソースのライブラリを使用している点も特徴です。
ちなみに、この「日別シート」というのが、データベースにGoogleスプレッドシートを使っているからこそ出来る仕様です。通常のデータベースですと、日別のデータを帳票形式で参照するには別のフォームを設計する必要がありますが、Googleスプレッドシートを使っているために、何もしなくても見返し易い形でデータが蓄積されていきます。
- 「家計簿アプリ」の機能ご紹介です。読み込み、書き出しの一連の流れと、一部の項目がプルダウンで入力できる様子を説明しています。
- 現在の日付をもとに、自動的に日付を名前としたシートを追加する部分の説明です。GASでの曜日などの扱い方も判ります。
- 指定日のシートを読み込んで、テーブル形式フォームに表示させます。プルダウンをどうやってテーブルの中に実装するかが判ります。
- テーブル形式フォームの値を読み取って、書き込む部分の説明です。テーブルのセルの中に埋め込んだプルダウンへのアクセスが以外と難物で、JQueryの力を借りてアクセスします。任意のセル中のプルダウンにどうアクセスするかは、ずいぶん悩んでようやく実装できました。
- このアプリでは過去の日付シートも読み出せます。フォームから指定の日付のシートを読み出す部分を説明しています。
- このアプリのスクリプトとテンプレートのコードをご紹介しています。私の環境ではうまくいってますが、ノークレームでご参考にしてください。