- 公開日:
GASでスプレッドシート上に検索ボックスを作る方法
Google スプレッドシートではGoogle Apps Script(GAS)を使用することで、シート上に検索ボックスを作成することが出来ます。
この記事では、GASでスプレッドシート上に検索ボックスを作る方法を分かりやすく紹介します。
GASでスプレッドシート上に検索ボックスを作る方法
シート上のデータを対象とした検索ボックスを作る場合、作成したスクリプトを、トリガー(発動する際の条件)で設定します。
検索ボックスとしたセルに、検索したい内容が入力された(編集された)ことをトリガーとして、検索結果をシート上に表示させます。
あらかじめ用意した検索ボックス用セル「B11」に検索したい内容を入力し、「A12」から始まる行へ、列単位でデータを反映させることを条件としてGASでスクリプトを作成します。
①「拡張機能」、②「Apps Script」を順に選択します。
「新しいプロジェクト」ボタンをクリックします。
「名前を変更」をクリックします。
①「プロジェクトタイトル(例:シート内検索)」を入力し、②「名前を変更」ボタンをクリックします。
下記のスクリプトをコピーして貼り付けます。
検索ボックスと結果を表示するセルをそれぞれ指定し、検索結果に付随するデータを列単位で入力するスクリプトです。
function onEdit(e) {
const sheet = e.source.getActiveSheet();
const searchBoxCell = 'B11'; // 検索ボックスのセル位置
const resultsStartCell = 'A12'; // 結果を表示する開始セル位置
// 編集されたセルが検索ボックスでない場合は何もしない
if (e.range.getA1Notation() !== searchBoxCell) return;
const searchTerm = e.value;
if (!searchTerm) return; // 検索ボックスが空の場合は何もしない
const dataRange = sheet.getDataRange();
const values = dataRange.getValues();
const searchResults = [];
// シート全体を検索し、一致するセルの行を結果に追加
for (let row = 0; row < values.length; row++) {
for (let col = 0; col < values[row].length; col++) {
if (values[row][col].toString().includes(searchTerm)) {
searchResults.push(values[row]);
break; // 行全体を追加したら、次の行へ
}
}
}
// 結果の表示エリアをクリア
const resultsStartRange = sheet.getRange(resultsStartCell);
sheet.getRange(resultsStartRange.getRow(), resultsStartRange.getColumn(), sheet.getMaxRows(), sheet.getMaxColumns()).clearContent();
// 検索結果をシートに書き込み
if (searchResults.length > 0) {
sheet.getRange(resultsStartRange.getRow(), resultsStartRange.getColumn(), searchResults.length, searchResults[0].length).setValues(searchResults);
}
}
「searchBoxCell」に検索ボックスのセル位置を、「resultsStartCell」に結果を表示する開始セル位置を指定してください。
左にあるトリガーをクリックします。
「トリガーを追加」ボタンをクリックします。
①「onEdit」、②「Head」、③「スプレッドシートから」、④「編集時」とそれぞれ選択して、⑤「保存」ボタンをクリックします。
エディタに戻り「プロジェクトを保存」ボタンをクリックします。
シートに戻り、検索ボックスに検索したいデータ(文字)を入力します。
検索した文字に付随するデータが検索結果として表示されました。