Webアプリケーションの検索フォームでチェックボックスの状態を保持する実装は意外と面倒なもの。今回はそんな検索フォームのチェックボックスの状態保持のサンプルコード（主に管理画面を想定）をご紹介します。
目指す機能
- ・一度検索したチェックボックスの状態をセッションに保持しフォームに再反映する
- ・初回アクセスで値がないときはすべてのチェックボックスがチェックされた状態にする
通常チェックボックスはチェックされたものを表示するため、最初にすべてチェックが外された状態の場合検索結果が何も出ない状態からはじまることが懸念されます。
しかしながら最初はある程度デフォルトの状態で検索結果が表示される仕様にしたいという要望は割と発生します。
この場合何もチェックされていない状態ではすべて表示するという実装方法もありますが、これはUI的には少しわかりづらいと思います。
そこで今回は初回アクセスではチェックボックスがすべてチェックされた状態からはじまる仕様を目指しました。
ソースコード
<?php
/* リストサンプル */
$checklist = array( "りんご", "みかん", "バナナ" );
/* 検索値保持 */
if($_POST['mode'] == "search"){
/* 検索値をセッションに保持 */
$_SESSION['search']['checklist'] = $_POST['checklist'];
/* セッションの中身を表示 */
print_r($_SESSION['search']['checklist']);
}
?>
<!-- フォームを表示 -->
<form name="search" action="" method="post">
<?php foreach($checklist as $key => $value){ ?>
<?php if(!empty($_SESSION['search']['checklist'])){ ?>
<input type="checkbox" id="checklist" name="checklist[<?php echo $key; ?>]" value="1"
<?php if($_SESSION['search']['checklist'][$key]==1){ ?>
checked="checked"
<?php } ?>
> <?php echo $value; ?>
<?php } else { ?>
<input type="checkbox" id="checklist" name="checklist[<?php echo $key; ?>]" value="1" checked="checked"> <?php echo $value; ?>
<?php } ?>
<?php } ?>
<input type="hidden" name="mode" value="search" />
<input type="submit" id="search" name="search" value="この条件で検索する" />
</form>
ここでデータの保持にセッションを利用しているのはページ送りの際に検索値を保持することを想定しているためです。
登録画面から確認画面への遷移の場合にはinputのhidden属性で情報を引き回すことができますが、ページ送りを考えるとセッションで情報を持った方が簡単だろうという考えです。
この場合、検索画面が複数ある場合に検索情報が混乱するケースが想定されますが、これについてはセッションの配列名に画面固有の情報を入れればクリアできるだろうと思います。
まとめ
いかがでしたでしょうか？今回は管理画面を想定した実装アイディアでしたが、ユーザーが利用する画面ではpostではなくget方式で検索値を持った方がよいかと思います。
getで検索値を持つ場合、検索結果にURLベースでアクセスできますし、その検索結果ページが検索エンジンにインデックスされるためSEO対策上もメリットがあります。
ただget方式の場合にもチェックボックスへの状態反映の方法としては、今回の実装方法が流用できるかと思います。（getの値を配列に入れれば同じこと）