GASでGoogleフォームにメールアドレスの入力欄とバリデーションを追加する方法

photo credit: baldiri arroba via photopin (license)

みなさん、こんにちは！
タカハシ(@ntakahashi0505)です。

GASでGoogleフォームを作成するツールの作り方について解説をしています。

前回の記事はコチラ。

GASでGoogleフォームに記述式の質問を追加する方法

GASでGoogleフォームを作成する方法についてお伝えしています。今回は、GASで作成するフォームに、addTextItemメソッドを使って氏名や会社名などの記述式の質問を追加していきます。

フォームにテキスト形式、つまり記述式の質問を追加する方法をお伝えしました。

氏名、会社名の入力欄を作ることができましたので、今回はメールアドレスの入力欄を作っていきたいと思います。

ということで、GASでGoogleフォームにメールアドレスの入力欄を追加する方法です。

また、メールアドレスではないときに入力を制限してくれる「回答の検証」の設定もしていきますよ。

では、行ってみましょう！

前回のおさらい
フォームにメールアドレスの入力欄を追加する
1. メールアドレスかどうか回答を検証する
TextItemオブジェクトの回答の検証を設定する
テキスト用の回答の検証をビルドする
メールアドレスの入力欄を追加したフォームを作るスクリプト
まとめ
連載目次：GASでGoogleフォームを一発で作成するツールを作る

前回のおさらい

前回までに作成したコードはコチラです。

function createEventForm(){
 
  const ss = SpreadsheetApp.getActiveSpreadsheet()
  const values = ss.getSheetByName('イベント概要').getDataRange().getValues();
  const formTitle = values[0][1]; //タイトル
  const formDescription = values[1][1]; //概要
  
  const form = FormApp.create(formTitle);
    
  const id = PropertiesService.getScriptProperties().getProperty('FOLDER_ID');
  const formFile = DriveApp.getFileById(form.getId());
  DriveApp.getFolderById(id).addFile(formFile);
  DriveApp.getRootFolder().removeFile(formFile);
 
  form.setDescription(formDescription);
  form.addTextItem().setTitle('氏名').setRequired(true);
  form.addTextItem().setTitle('会社名');     
  
}

スプレッドシートの情報をもとに、スクリプトプロパティのFOLDER_IDに指定したフォルダに新規のフォームを作成します。

フォームの質問は「氏名」と「会社名」という記述式の入力欄が２つです。

イベントの申し込みであれば、さらに必要な入力項目ありますよね。

例えば、メールアドレス。連絡手段ほしいっすもんね。

フォームにメールアドレスの入力欄を追加する

メールアドレスとはいえ、「氏名」や「会社名」と同様、記述式を使います。

つまり、以下のステートメントを追加してあげればOKです。

form.addTextItem().setTitle('メールアドレス').setRequired(true);

はい終わり～！

…だと、記事として薄すぎるので、もうちょっとGASの便利なところを紹介していきましょう。

メールアドレスかどうか回答を検証する

記述式なので、文字列であれば、なんでも入力できてしまいます。

間違えて住所を入れてしまうかも知れませんし、「@」を忘れてしまうかも知れません。

それを避けるために、Googleフォームには入力された回答がメールアドレスかどうかを判定する「回答の検証」という機能があります。

そして、それはGASからも設定することができるのです。

TextItemオブジェクトの回答の検証を設定する

では、「回答の検証」の設定の仕方を説明していきましょう。

TextItemオブジェクトに「回答の検証」を設定するためには、setValidationメソッドを使います。

書式はコチラです。

TextItemオブジェクト.setValidation(バリデーション)

引数の「バリデーション」には、テキスト用の回答の検証を表すTextValidationオブジェクトを指定します。（Validationとは「検証」という意味ですね。）

例えば、TextValidationオブジェクトがvalidationEmailという変数にセットされているとしたら、前述のメールアドレスの質問追加のステートメントを以下のようにしてあげればOKです。

form.addTextItem().setTitle('メールアドレス').setRequired(true).setValidation(validationEmail);

テキスト用の回答の検証をビルドする

それで、そのTextValidationオブジェクトを用意する必要がありますよね。

いくつか手順がありまして、流れとしては以下のような流れになります。

TextValidationBuilderオブジェクトを生成する
生成したTextValidationBuilderオブジェクトに追加したい検証をセットする
TextValidationBuilderオブジェクトからTextValidationオブジェクトをビルドする

なんじゃこれ、ややこしいな…と思われるかも知れませんね。

大丈夫。解説していきます。

なお、TextValidationBuilderオブジェクトとは、テキスト用バリデーションをビルドするためのオブジェクトです。

このオブジェクトにあれこれ検証として追加したい項目をセットしていって、最終的に「ビルド」をすることで、TextValidationオブジェクトが完成します。

TextValidationBuilderオブジェクトを生成する

まず、TextValidationBuilderオブジェクトを生成します。

これにはFormAppオブジェクトのcreateTextValidationメソッドを使います。

こちらです。

FormAppオブジェクト.createTextValidation()

戻り値はTextValidationBuilderオブジェクトです。

TextValidationBuilderオブジェクトに検証「メールアドレス」を追加する

生成されたTextValidationBuilderオブジェクトにメールアドレスかどうかの検証を追加します。

そのための、requireTextIsEmailメソッドが用意されています。

TextValidationBuilderオブジェクト.requireTextIsEmail()

TextValidationオブジェクトをビルドする

検証の設定はこれでOKですので、ビルドをしてTextValidationオブジェクトにします。

TextValidationBuilderオブジェクトにbuildメソッドを使います。

TextValidationBuilderオブジェクト.build()

こうしてできたTextValidationオブジェクトを、TextItemオブジェクトにsetValidationしてあげればOKです。

メールアドレスの入力欄を追加したフォームを作るスクリプト

以上を踏まえて、メールアドレスの入力欄も追加するようにしたスクリプトはこのようになります。

function createEventForm(){
 
  const ss = SpreadsheetApp.getActiveSpreadsheet()
  const values = ss.getSheetByName('イベント概要').getDataRange().getValues();
  const formTitle = values[0][1]; //タイトル
  const formDescription = values[1][1]; //概要
  
  const form = FormApp.create(formTitle);
    
  const id = PropertiesService.getScriptProperties().getProperty('FOLDER_ID');
  const formFile = DriveApp.getFileById(form.getId());
  DriveApp.getFolderById(id).addFile(formFile);
  DriveApp.getRootFolder().removeFile(formFile);
 
  form.setDescription(formDescription);
  form.addTextItem().setTitle('氏名').setRequired(true);
  form.addTextItem().setTitle('会社名');
  
  const validationEmail = FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('メールアドレス').setRequired(true).setValidation(validationEmail);
  
}

新たに追加したのは、19,20行目ですね。

実行すると、以下のように「回答の検証」として、テキストのメールアドレスが設定されていることが確認できます。