公開日：2024/03/15

スプレッドシートでプルダウンを複数選択する方法

スプレッドシートを使ってリストから複数の選択肢を選ぶ際、プルダウンリストを活用すると効率的にデータ入力ができます。

しかし、通常のプルダウンリストでは一つの選択肢しか選べないため、複数選択したい場合は工夫が必要です。

今回は、スプレッドシートでプルダウンを複数選択する方法について解説します。

スプレッドシートでプルダウンを複数選択する方法

結論を申し上げると、スプレッドシートでプルダウンから複数選択する機能は、デフォルトでは提供されていません。

ですが、チェックボックスやGoogle Apps Scriptを使用することで、その機能を模倣することができます。

以下に、チェックボックスを使用する方法とGoogle Apps Scriptを使用する方法の２つの方法を順を追って説明します。

チェックボックスを使用する方法

この方法では、選択肢ごとにチェックボックスを用意し、それを使って複数選択を実現します。

下記の記事にて、スプレッドシートでチェックボックスを作成する方法と、その使用方法について解説していますのでご参照ください。

スプレッドシートでチェックボックスを作成する方法

Google Apps Scriptを使用する

Google Apps Scriptでサイドバーを表示させて、複数選択の入力装置を作成する方法についてご紹介します。

HTMLとJavaScriptを使って、チェックボックスを含むフォームを作成し、ユーザーがマウスのみで選択肢を選べるように作成します。

スプレッドシートを開き、①メニューバーの拡張機能をクリックし、②「Apps Script」をクリックします。

①「ファイルを追加」をクリックしファイルを開き、②「HTML」をクリックします。

①ファイルには適切な名前を付け（例：SidebarForm.html）、②下記のコードをコピー＆ペーストし、③「保存」ボタンをクリックします。

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
    <form id="myForm">
      <input type="checkbox" name="choice" value="リンゴ">リンゴ<br>
      <input type="checkbox" name="choice" value="バナナ">バナナ<br>
      <input type="checkbox" name="choice" value="オレンジ">オレンジ<br>
      <button type="button" onclick="submitForm()">送信</button>
    </form>

    <script>
      function submitForm() {
        google.script.run.withSuccessHandler(function() {
          google.script.host.close();
        }).processForm(document.getElementById("myForm"));
      }
    </script>
  </body>
</html>

このコードは、複数選択を可能にするチェックボックスのリストを含むフォームを追加できます。

今回の選択肢（例:リンゴ、バナナ、オレンジ）の文字を変更することで、オリジナルのリストを作成することが可能です。

①「ファイルを追加」をクリックし、②「スクリプト」をクリックします。

ファイル名はオリジナルで構いません。

①下記のコードをコピー＆ペーストして、②「保存」ボタンをクリックします。

function showSidebar() {
  var html = HtmlService.createHtmlOutputFromFile('SidebarForm')
      .setTitle('選択肢')
      .setWidth(300);
  SpreadsheetApp.getUi().showSidebar(html);
}

function processForm(formObject) {
  var choices = formObject.choice;
  Logger.log(choices); // 選択された値をログに記録する
  // ここで選択された値を処理するコードを追加します
}

このコードは、スプレッドシートにサイドバーを表示させるためのものです。

①また新たなファイル（スクリプト）を作成し、②下記のコードをコピー＆ペーストして、③「保存」ボタンをクリックします。

function onOpen() {
  var ui = SpreadsheetApp.getUi();
  ui.createMenu('カスタムメニュー')
      .addItem('選択肢を表示', 'showSidebar')
      .addToUi();
}

このコードは、スプレッドシートが開かれたときにカスタムメニューから選択しを表示させるためのものです。

ここで入力したコードが正しく実行できるかを確認します。

①実行させるファイルを選択し、②「実行」ボタンをクリックします。

スクリプトの実行が初めての場合、アクセスの承認を求められます。

「権限を確認」ボタンをクリックします。

「詳細」をクリックします。

「無題のプロジェクト（安全ではないページ）に移動」をクリックします。

「許可」ボタンをクリックします。

再度、「実行」ボタンをクリックすると、実行ログが表示されます。

コードが正しく機能している場合、「実行完了」と表示されます。

同様に、もう一つのスクリプトも確認しましょう。

次に、①新たなファイル（スクリプト）を作成し、②下記のコードをコピー＆ペーストして、③「保存」をクリックします。

function processForm(formObject) {
  var sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
  var choices = formObject.choice;
  
  // 単一選択の場合、choicesを配列に変換
  if (typeof choices === 'string') {
    choices = [choices];
  }
  
  // 選択された選択肢をカンマ区切りの文字列に変換
  var choicesString = choices.join(", ");
  
  // カンマ区切りの文字列をA列の新しい行に追加
  if (choices) {
    sheet.appendRow([choicesString]);
  }
}

このコードは、選択した文字列をカンマ区切りでA列に記録させるためのものです。