2021年6月21日 | ねこ先生がプログラミングをガリ勉してみた(=^x^=)♪

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

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

です。

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

前回のコードです。

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);

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

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

ここまでのコードです。

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

←前に戻るにゃっ！　　　　　　　　　　次行くにゃん(=^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);

}

フォームの原型です。