フォーム自作（テキスト・チェックボックス）（３）

■きゃー、一年が終わってしまう。。。

　　　なんとか年内には！と駆け込み投稿です。

　　　テキスト入力・チェックボックス選択内容をスプレッドシートに保存し、
　　　Googleサイトに新規にページを追加する、というスクリプトの続きです。

　　　前回までで下準備・BUIビルダーを利用したUI作成まで紹介しましたので、
　　　今回は、スクリプトのご紹介です。


■スクリプト全文はこちら

　　　以下のURLに、スクリプトの全文と実際に動かして試せるようにしています。

　　　　https://sites.google.com/a/mypleis.com/gas_mypleis/GAS_ALL/15_form


■簡単スクリプト解説

　　　スクリプト全文は上記のURLで確認して頂くとし、ブログ上では一部抜粋して
　　　簡単解説してみようと思いま～す。

　　　さて、前々回の記事で、次の3つのfunctionの外枠だけ作成されていると思います。

　　　　　（１）function doGet(e) {　}
　　　　　　　　　　・・・UIを起動するためのfunction

　　　　　　（２）function checkHandler(e) {　}
　　　　　　　　　　・・・チェックボックス選択時の処理を定義するためのfunction

　　　　　　（３）function myClickHandlerButton(e) {　}
　　　　　　　　　　・・・「登録」ボタン押下時の処理を定義するためのfunction

   　　　この3つのfunctionを一つずつ簡単に解説します。

　＜（１）function doGet(e){}＞

　　　　⇒フォームの入力項目のうち、「年代」を選択するチェックボックス用の設定。
　　　　　　　　－チェックボックス毎に対応するユーザープロパティ（※1）の箱を準備する。
　　　　　　　　　　　例）　「age1」という名前のユーザープロパティを作成し、
　　　　　　　　　　　　　　「false」という値を格納する。

　　　　　　　　※1　ユーザプロパティとは、ユーザー毎に値を保管することができる入れ物のこと。
　　　　　　　　　　　　　（似たようなもので、スクリプトプロパティという入れ物もあります。
　　　　　　　　　　　　　　今回のケースでは、多分どちらでもOKです。）

　　　　　　　　　　　　　以下の手順で確認することができます。
　　　　　　　　　　　　　　　・スクリプトエディタ　→　ファイル　→　プロジェクトのプロパティ

　　　-------------------------------------------------------------------

　　　　⇒フォームで「登録」ボタンを押下した後に表示されるダイアログボックスの外枠作成。

　　　　　ダイアログボックスの中身は、GUIビルダーで作成済み。

　　　　　上から順に、下記のような意味。

　　　　　　　　 －createDialogBox（autoHideの可否,modalの可否）という

　　　　　　　　　　　　　　　　　　　　　 　構文で、それぞれ次のような意味

　　　　　　　　　　　　　　　　　　　　　　　　autoHide…ダイアログボックスを複数表示する場合、

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　自動的に古いボックスを閉じる

　　　　　　　　　　　　　　　　　　　　　　　　modal…ダイアログボックス表示時に、それ以外の

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　部品（ボタン等）を使用不可状態にする

 　　　　　　　　－ダイアログボックスのID 設定

　　　　　　　　－ダイアログボックスをドラッグで移動できるように設定

　　　　　　　　－ダイアログボックス表示位置設定（上から○○px）

　　　　　　　　－　　　　　　　同上　　　　　　　　　　（左から○○px）

　　　　　　　　－ダイアログボックスタイトルバーの表示設定

　　　　　　　　－ダイアログボックスの大きさ設定（幅＋高さ）

　　　　　　　　－ダイアログボックスを非表示に設定

　　　　　　　　－BUIビルダーで作成済みの部品名”DialogPanel”を呼び出し

　　　　　　　　－呼び出したPanelを今作成したダイアログボックスの外枠に追加

　　　　　　　　－ダイアログボックスをアプリに追加

　　　　-------------------------------------------------------------------

　　　⇒GUIビルダーで作成したAnchor（=リンク）の表示タブ設定
　　　　　　　－どのタブでリンクを開くかは、”.setTarget()”で設定します。
　　　　　　　－括弧()の中に、以下のいづれかを書きます。
　　　　　　　　　　　新しいタブで開く場合　　 ：　”_blank”
　　　　　　　　　　 現在のタブで開く場合　　：　”_self”
　　　　　　　－今回は、「現在のタブ」で開くようにしています。
　　　　　　　－尚、GUIビルダーを使ってリンク（=Anchor）を作成する場合、GUIビルダー上では
　　　　　　　　「新しいタブで開く」しか設定できない（というか、設定するプロパティがない）ので、
　　　　　　　　スクリプトエディタでスクリプトを書く必要があります。


今日はここまで