<ねこフォーム6>ねこあつめフォームに「チェックボックス」を追加する

この記事では、GAS(Google Apps Script)を使って、ねこあつめフォームに「チェックボックス」を追加します。
お世話になった記事は、いつも隣にITのお仕事さんの、

GASでGoogleフォームにチェックボックス形式の質問を追加する方法

です。

まず、前回の復習をします。
このようなフォームを作って、ラジオボタンを追加しました。

前回のコードです。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

  //メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

  //←ラジオボタンを加える
  form.addMultipleChoiceItem()
    .setTitle('種類は何系?')
    .setChoiceValues(['みけ','とら'])
    .setRequired(true);

}

今回の内容に入る前に、ねこあつめ画像で癒されます(=^x^=)

前回のラジオボタンで作った選択肢は、「みけ」か「とら」かだけでしたが、上の画像の「ねこまたさん」など、「みけ」でも「とら」でもないコもいるので、「その他」のチェックボックスも作ってみます。

こちらのコードを追加します。

//←チェックボックスを追加する
  form.addCheckboxItem()
    .setTitle('種類は何系?(チェックボックス)')
    .setChoiceValues(['みけ','とら']) 
    .showOtherOption(true)//その他のチェックボックスを作っている
    .setRequired(true); 

実行してプレビューで確認した画面です。

ここまでのコードをまとめます。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

  //メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

  //ラジオボタンを加える
  form.addMultipleChoiceItem()
    .setTitle('種類は何系?(ラジオボタン)')
    .setChoiceValues(['みけ','とら'])
    .setRequired(true);

  //←チェックボックスを追加する
  form.addCheckboxItem()
    .setTitle('種類は何系?(チェックボックス)')
    .setChoiceValues(['みけ','とら']) 
    .showOtherOption(true)//その他のチェックボックスを作っている
    .setRequired(true); 

}

ご精読ありがとうございました。

■参考文献の紹介■
初めてGASを学ぶ方向け。
スプレッドシートの基本的な使い方からGASのベースとなるJavaScriptの基礎文法、GASでの初歩的なプログラミングを学べます。

GASに少し慣れて来たら、基礎固めとリファレンスとしてこの本を通してじっくり学べます。

サイトマップはこちらから

GASサンプル集に戻る
メインメニューに戻る
これからプログラミングを始める方へ
基本情報技術者へ
自己紹介

←前に戻るにゃっ!          次行くにゃん(=^x^=)→

<ねこフォーム5>ねこあつめフォームに「ラジオボタン」を追加する

この記事では、GAS(Google Apps Script)を使って、ねこあつめフォームに「ラジオボタン」を追加します。お世話になった記事は、いつも隣にITのお仕事さんの、

GASでGoogleフォームにラジオボタンの質問を追加する方法

です。

まずは前回の復習をします。
メールアドレスが正しいかどうか検証するコードを書きました。

このようなフォームの原型を作成し、1番下に「めあど」のテキストアイテムが入力必須で追加されました。

プレビュー画面にすると、

このようになり、最後の「めあど」の所に架空のアドレスを入力します。

このメアドから「@」を削除して送信を押すと、

この様に、有効なアドレスではないと検証されました。

前回のコードです。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

  //←メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

}

今回の内容に入る前にねこあつめ画像で癒されます。

今回は「ラジオボタン」を作って行きます。
ラジオボタンは「MultipleChoiceItem」で、タイトルと選択項目や必須かどうかを下記のコードで加えます。

//←ラジオボタンを加える
  form.addMultipleChoiceItem()
    .setTitle('種類は何系?')
    .setChoiceValues(['みけ','とら'])
    .setRequired(true);

ラジオボタンの設定には、タイトルと選択項目が必要です。
コードを見た所、選択項目は配列(リスト)になっています。
この記述でのラジオボタンは、配列(リスト)になっている所の「みけ」か「とら」かの2択を選択出来るようなっています。

実行してプレビュー画面を開きました。

ここまでのコードです。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

  //メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

  //←ラジオボタンを加える
  form.addMultipleChoiceItem()
    .setTitle('種類は何系?')
    .setChoiceValues(['みけ','とら'])
    .setRequired(true);

}

ご精読ありがとうございました。

■参考文献の紹介■
初めてGASを学ぶ方向け。
スプレッドシートの基本的な使い方からGASのベースとなるJavaScriptの基礎文法、GASでの初歩的なプログラミングを学べます。

GASに少し慣れて来たら、基礎固めとリファレンスとしてこの本を通してじっくり学べます。

サイトマップはこちらから

GASサンプル集に戻る
メインメニューに戻る
これからプログラミングを始める方へ
基本情報技術者へ
自己紹介

←前に戻るにゃっ!          次行くにゃん(=^x^=)→

<ねこフォーム4>ねこあつめフォームに「メールアドレス」を追加する

この記事では、GAS(Google Apps Script)を使って、 Googleフォームに入力したメールアドレスが、「@」が含まれていてメールアドレスとして正しいのかを判定する、入力テキストアイテムを作成して行きます。
お世話になった記事は、いつも隣にITのお仕事さんの、

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

です。

前回の復習ですが、

このようなフォームの原型を作成して、

この「目」のマークを押して、

フォームのプレビューを表示させました。
お名前は、入力必須の*がついています。

前回のコードです。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //←テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

}

今回の内容に入る前に、ねこあつめの画像で癒されます。

さて今回は、「おなまえ」と「あそんだグッズ」に加えて、「めあど」のテキストアイテムを追加します。

Mailアドレスの入力項目を追加するには、「それがメールであるか」を検証する必要が出てくるのが、「おなまえ」や「あそんだグッズ」よりも若干複雑になります。

追加するコードは下記の2行です。

//←メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

このコードで必要なことは、最初の行で、createTextValidation()で、「検証する」という動作を作ります。また、requireTextIsEmail()で、それがE-mailのアドレスであるのか判定します。build()では「E-mailのアドレスであるのか検証するオブジェクトを」作成します。

次の行では、今までの「おなまえ」や「あそんだグッズ」と同じようにテキストアイテムを設定して、1行目で作ったオブジェクトの検証をします。

この2行の理解を深めるIT用語について掲載しました。
ITパスポート基本情報技術者試験でお世話になった「「分かりそう」で「分からない」でも「分かった」気になれるIT用語辞典」のリンクを貼りましたので、不安な用語がございましたら、チェックして見て下さい。

オブジェクト

メソッド

バリデーション

ビルド

では、先ほどの2行を追加したコードで、動作を確認します。

function myFunction() {

  //SpreadsheetAppから現在のスプレッドシートにアクセス
  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);

  //ここでプロパティストアに格納したFOLDER_IDを使って、指定のフォルダにフォームを作成する
  const id=PropertiesService.getScriptProperties().getProperty('FOLDER_ID');//idにFOLDER_IDを格納する
  const formFile=DriveApp.getFileById(form.getId());//作成したフォームのIDをformFileに格納する
  DriveApp.getFolderById(id).addFile(formFile);//指定のフォルダにフォームを格納する
  DriveApp.getRootFolder().removeFile(formFile);//マイドライブに作成されたフォームを削除する

  //フォームの説明を作成
  form.setDescription(formDescription);

  //テキストアイテムを追加する
  form.addTextItem().setTitle('おなまえ').setRequired(true);//trueにすることで、入力必須にしている。
  form.addTextItem().setTitle('あそんだグッズ');

  //←メールアドレスのテキストアイテムを加える
  const validationEmail=FormApp.createTextValidation().requireTextIsEmail().build();
  form.addTextItem().setTitle('めあど').setRequired(true).setValidation(validationEmail);

}

フォームの原型です。

また、「目のマーク」からフォームのプレビューを開きます。

「めあど」の部分を詳しく見てみます。
架空のアドレス「neko22@cat.jp」と入力しました。

このままで送信を押せますが、「@」を取って送信ボタンを押してみます。

「@」を入れて送信した所、無事に送れました。
ご精読ありがとうございました。

■参考文献の紹介■
初めてGASを学ぶ方向け。
スプレッドシートの基本的な使い方からGASのベースとなるJavaScriptの基礎文法、GASでの初歩的なプログラミングを学べます。

GASに少し慣れて来たら、基礎固めとリファレンスとしてこの本を通してじっくり学べます。

サイトマップはこちらから

GASサンプル集に戻る
メインメニューに戻る
これからプログラミングを始める方へ
基本情報技術者へ
自己紹介

←前に戻るにゃっ!           次行くにゃん(=^x^=)→