Google スプレッドシート で入力フォームを無理やり作ってみた。

求人票をweb化してみた。の続編です。

入力してもらっている事務の方から、

👩(事務職員)：エクセルだったらフォームで入力できるじゃん？ Google スプレッドシート ではできないの？

👨(私)：えー・・・ちょっと調べてみます！

といった形で、言われたことは断れない。いや・・・私にはなかったアイディアをもらってありがとう！
という気持ちで、ChatGPT様に聞いてみました。

GASの知識はゼロですが、ChatGPT様はこんな願い事も叶えてくれるのです・・・

以下のGASはやりたいことをChatGPT様に相談し、完成したGASです。
ちなみに、記事の文章もChatGPT様に作成してもらっています。

※ Google スプレッドシート の構成については先ほどもリンクを貼っていますが、こちらから確認できます。

---

Googleスプレッドシートでカスタムメニューとフォームを使用する方法

Google Apps Script (GAS) を使用して、Googleスプレッドシートにカスタムメニューを追加し、特定のフォームを介してデータを簡単に入力・保存する方法を紹介します。この機能は、データ入力作業を効率化し、ユーザーインターフェイスを改善するのに役立ちます。

ステップ1: カスタムメニューの作成

最初のステップは、スプレッドシートが開かれた際に自動的にカスタムメニューを追加することです。

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('カスタムメニュー')
      .addItem('フォームを開く', 'openForm')
      .addToUi();
}

このコードスニペットにより、「カスタムメニュー」という名前の新しいメニューがスプレッドシートのメニューバーに追加されます。このメニューには、「フォームを開く」というオプションが含まれ、これを選択すると`openForm`関数が呼び出されます。

ステップ2: フォームの表示

ユーザーが「フォームを開く」を選択すると、HTMLベースのフォームがモーダルダイアログとして表示されます。このフォームは、ユーザーがデータを入力できるように設計されています。

function openForm() {
  // スプレッドシートとアクティブシートの取得
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  
  // 特定の範囲からデータを取得
  var range1Values = sheet.getRange("B1:F1").getValues()[0];
  var range2Values = sheet.getRange("H1:L1").getValues()[0];
  
  // データを結合
  var fieldNames = range1Values.concat(range2Values);
  
  // アクティブなセルの位置情報を取得
  var activeCell = sheet.getActiveCell();
  var row = activeCell.getRow();
  var column = activeCell.getColumn();
  
  // HTMLフォームを作成し、データを渡す
  var htmlOutput = HtmlService.createTemplateFromFile('Form');
  htmlOutput.fieldNames = fieldNames;
  htmlOutput.row = row;
  htmlOutput.column = column;
  
  // フォームを表示
  var output = htmlOutput.evaluate().setWidth(500).setHeight(300);
  SpreadsheetApp.getUi().showModalDialog(output, 'Enter Details');
}

この関数では、スプレッドシートから特定の範囲のデータを取得し、それらをフォームに渡します。フォームは、これらのデータを元にユーザーからの入力を受け付ける質問を生成します。

ステップ3: フォームからのデータ保存

ユーザーがフォームに入力したデータは、`handleFormSubmit`関数を通じてスプレッドシートに保存されます。

function handleFormSubmit(formObject) {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var rowData = [];
  
  // フォームオブジェクトからデータを取得し、配列に格納
  for (var i = 

1; i <= 5; i++) {
    rowData.push(formObject['field' + i]);
  }
  
  rowData.push("");  // G列を空白に
  
  for (var i = 6; i <= 10; i++) {
    rowData.push(formObject['field' + i]);
  }
  
  // 取得したデータをスプレッドシートに書き込み
  var row = formObject.row;
  var column = formObject.column;
  sheet.getRange(row, column, 1, rowData.length).setValues([rowData]);
}

このステップでは、フォームから受け取ったデータを適切なスプレッドシートの位置に保存します。特に、データはB列からL列に配置され、G列は空白のままになります。

注意点

• アクティブセルの選択: フォームを開く前に、アクティブセルを正しく選択しておく必要があります。これは、データを保存する場所を決定するために使用されます。

• 権限の許可: GASを初めて実行する際には、スプレッドシートへのアクセスを許可する必要があります。

• スプレッドシートの構造: スクリプトは特定のセル範囲からデータを取得するように設計されているため、スプレッドシートの構造を変更する場合は、スクリプトもそれに合わせて更新する必要があります。

この記事を通じて、GASを利用してスプレッドシートのデータ管理を効率化する方法を学びました。GASは、Googleスプレッドシートをより動的でインタラクティブにする強力なツールです。

---

最後に

ちょっとした悩みを解決しながら、自分の知識も増える。
信頼関係を築く。
このGAS関係は教えれないけど、アプリの基本的な操作方法はその場で伝えて解決。
この地道なステップが大事なんだな〜と改めて気づいてきました。

スキ　ボタン押してもらえると励みになります。