以前⬇️の記事で、プルダウンから選択して検索できる機能を実装しました。
ここで作成した検索機能を、プルダウンから複数選択して検索できるようにアップデートしてみます。
作成物
「媒体」を複数選択して検索できるようになっています。
ビューの編集
今回編集したのは、「媒体」検索機能のselect要素のみです。
select要素のname属性を配列にして、選択されたoption要素を配列で受け取れるようにします。
またselect要素にmultiple属性を加えます。
index.blade.php
<form action="{{ route('index') }}" method="GET">
//略
<label for="">媒体
//元のコード <select name="medium">
<select name="medium[]" multiple>
<option value="">全て</option>
@foreach ($media_list as $media_item)
<option value="{{ $media_item->getMedium() }}">{{ $media_item->getMedium() }}</option>
@endforeach
</select>
</label>
//略
</form>
ルートの確認
ルートは以前作成した通りです。
web.php
Route::get('/', [TeachingMaterialController::class, 'index'])->name('index');
コントローラーの編集
今回編集したのは「媒体」の検索部分のみです。
TeachingMaterialController.php
class TeachingMaterialController extends Controller
{
public function index(Request $request)
{
//略
//元のコード
if(!empty($media)) {
$query->where('medium', '=', $medium);
}
//編集後のコード
if(!$media[0]==null) {
foreach($media as $medium) {
$query->orwhere('medium', '=', $medium);
}
}
//略
解説
- 元々のフォームでは、
option要素の「全て」を選択した場合はvalue=""の通り空のデータとなり、$mediaの中身は空でした。 - 今回フォームのselect要素のname属性を配列にしたことで、「全て」を選択した場合の
$mediaの中身は以下のようになります。よってif文の!empty($media)を!$media[0]==nullという条件に変更しました。
array (
0 => NULL,
)
- if文の中で、$mediaで受け取った配列の中身ひとつずつに対して、データの絞り込みを行います。