【コピペで使える】PHPで作る検索フォーム実装サンプル

tasan

今回はPHPで検索ページを作るベースとなるサンプルコードをご紹介したいと思います。

検索ページとは

ウェブアプリケーションにおいて検索ページ（検索フォーム）というのは必要不可欠なものです。

例えば賃貸物件を紹介するウェブサイトなどでは膨大な物件の中から自分に合った物件を探すために検索機能が必要ですし、顧客管理システムなどでも顧客を効率よく探すために検索フォームが必要になります。

しかしながらこの検索ページ、いざスクラッチで実装しようとすると意外と厄介なもので、しっかりと定型化しておかないと毎回悩むことになります。

そんなわけで今回備忘録も兼ねて、比較的過不足なく動くシンプルなコードをまとめてみました。

処理のフロー

検索ページにおけるアクセスは大きく分けて、

・検索実行時のアクセス
・通常時のアクセス

上記二通りがあります。

通常時のアクセスでは検索フォームはデフォルト値を設定し、検索フォーム設定後「検索ボタン」を押すとその内容に応じて絞り込んだリストを出力するといった流れです。

サンプルコード

POSTを使ったサンプルコード（search_post.php）


<?php
session_start();

// 検索時のアクセス
if($_POST['mode'] == "search"){

  // セッションを初期化
  $_SESSION['search'] = array();
  // セッションに入力値を入れる
  $_SESSION['search']['name'] = $_POST['name'];
  // データベース検索
  $content = getUserList($_SESSION['search']['name']);

// 通常時のアクセス
} else {

  // 初回のアクセス
  if(empty($_SESSION['search'])){
    // セッションにデフォルト値設定
    $_SESSION['search']['name'] = "";
  }
  // データベース検索
  $content = getUserList($_SESSION['search']['name']);

}
?>
<html>
<head></head>
<body>

  <h1>検索処理ページサンプル</h1>

  <h2>検索フォーム</h2>
  <div id="search-area">
    <form name="search" action="./search_post.php" method="post">
      <table>
      <tr>
        <th>名前</th>
        <td>
          <input type="text" id="name" name="name" value="<?php if(!empty($_SESSION[['search']['name'])){ echo $_SESSION['search']['name']; } ?>" placeholder="名前" />
        </td>
      </tr>
      </table>
      <input type="hidden" name="mode" value="search" />
      <p><input type="submit" id="search" name="search" value="この条件で検索する" /></p>
    </form>
  </div>

  <h2>検索結果</h2>
  <?php if(!empty($content)){ ?>
    <table>
    <?php foreach($content as $value){ ?>
      <tr>
        <td>
          <?php echo $value['name']; ?>
        </td>
      </tr>
    <?php } ?>
    </table>
  <?php } else { ?>
    <p>検索結果がありません。</p>
  <?php } ?>

</body>
</html>

一回の検索処理だけであればもっとシンプルですが、続けての検索を想定すると検索情報は保持したいためPOSTで送信された検索情報をセッションで保持するようにしています。

また検索一覧でのページ送りの処理を行う場合、異なるページ間で検索条件を引き継ぐ必要がありますのでセッションによる情報の保持、または、hidden属性による検索条件の保持が必要となってきます。

GETを使ったサンプルコード（search_get.php）


<?php
// 引数があれば検索処理
if(!empty($_GET)){
  // 検索値を取得
  $name = $_GET['name'];
  // データベースからリスト取得
  $list = getUserList($name);
// 引数がなければ全取得
} else {
  // データベースからリスト取得
  $list = getUserList();
}
?>
<html>
<head>
  <script>
    function search(){
      // エラーフラグ初期化
      var error = false;
      // 検索値取得
      var name = document.getElementById("name").value;
      // エラーチェック
      if(name==""){
        error = true;
      }
      // リダイレクト処理
      if(error){
        alert("検索値が入力されていません。");
      } else {
        location.href = './search_get.php?name=' + name;
      }
      eixt;
    }
  </script>
</head>
<body>

  <h1>検索処理ページサンプル</h1>

  <h2>検索フォーム</h2>
  <div id="search-area">
    <table>
    <tr>
      <th>名前</th>
      <td>
        <input type="text" id="name" value="<?php if(!empty($name)){ echo $name; } ?>" placeholder="名前" />
      </td>
    </tr>
    </table>
    <button onclick="search();">検索</button>
  </div>

  <h2>検索結果</h2>
  <?php if(!empty($list)){ ?>
    <table>
    <?php foreach($list as $value){ ?>
      <tr>
        <td>
          <?php echo $value['name']; ?>
        </td>
      </tr>
    <?php } ?>
    </table>
  <?php } else { ?>
    <p>検索結果がありません。</p>
  <?php } ?>

</body>
</html>

検索フォームに入力された検索値をJavascriptで動的に引数にセットしてリダイレクト、検索値の引数がある場合は条件指定でデータベースからリストを取得するようにしています。

検索条件を増やしたい場合はフォームと引数付加の処理を追加するだけです。

データベース取得側の関数は省略しますが、引数が存在する場合はWHERE文をセットし、存在しない場合はすべて抽出とする処理を行えばよいかと思います。

POSTとGETどちらがよい？

あくまでも経験上とはなりますが、検索フォームでは基本的にはPOSTよりもGETでの実装の方が使い勝手がよいと思います。

GETの場合はURLの引数として検索情報を付加できますので、特定の検索結果にURLで直接アクセスさせることができること、また検索エンジンに特定の条件での検索結果ページごとに認識させることができるためSEO上も強くなるからです。

POSTの場合上記のようなことはできませんし、また検索結果ページを更新した場合にエラー表示となりスムーズにページを表示できないこともデメリットのひとつです。

データベースに入力する処理はPOST、データベースから取得する処理はGETという感じで考えておくとよいかもしれません。

勿論取得する場合もデータベースへのアクセスが発生する以上は、セキュリティ対策は必要です。入力された検索値でSQLを操作されないようスクリプトのエスケープ処理などはしっかりしましょう。

Follow me!

投稿者プロフィール

tasan