同一ページで検索を表示したいが、すでにデータが表示されてしまう。

Question

実現したいこと

検索機能を作成しており、indexページで検索し、そのまま同一ページで検索結果が表示されるようにしたいのですが、すでに$roomsが表示されてしまいます。
検索が行われてから表示するようにしたいです。

発生している問題・エラーメッセージ

検索前からすでに$roomsに入っているレコードが全て表示されている状態です。

該当のソースコード

<x-app-layout>
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 leading-tight">
            検索
        </h2>
    </x-slot>
    <div>
      <form action="{{ route('room.index') }}" method="GET">
        <input type="text" name="keyword" value="{{ $keyword }}">
        <x-primary-button class="ms-4">
            <input type="submit" value="検索" class="search-btn">
        </x-primary-button>
      </form>
    </div>
    
    <div class="search-list">
        <div class="search-card-list">
          @forelse ($rooms as $room)
            <div class="search-card">
                <div class="search-post-content">
                    {{$room->name}}
                    {{$room->room_code}}
                    {{ $room['created_at']->format('Y年m月d日') }}
                    @if($room->host_id == $user->id)
                    @else
                    <form method="POST" action="{{ route('member.store') }}">
                        @csrf
                        <div>
                            <input type="hidden" id="member_id" name="member_id" value="{{$user->id}}">
                            <input type="hidden" id="room_id" name="room_id" value="{{$room->id}}">
                            <input type="text" id="room_password" name="room_password" >
                            <x-primary-button class="ms-4">
                                入室
                            </x-primary-button>
                        </div>
                    </form>
                    @endif
                </div>
            </div>
          @empty
            <div class="no-search-post">
              <h4>お探しのものは見つかりませんでした</h4>
            </div>
          @endforelse
          <div class="search-post-paginate">
            {{ $rooms->links('pagination::bootstrap-4') }}
          </div>
        </div>
    </div>
    
</x-app-layout>

public function index(Request $request)
    {
        $keyword = $request->input('keyword');

        $query = Room::query();

        if(!empty($keyword)) {
            $query->where('name', 'LIKE', "%{$keyword}%")
                ->orWhere('room_code', 'LIKE', "%{$keyword}%");
        }
        $user = Auth::user();
        $rooms = $query->paginate(10);
        return view('rooms/index', compact('rooms', 'keyword', 'user'));
    }

試したこと

@forelseを@foreachに変更したのですが、エラーによって表示させられませんでした。

補足情報（FW/ツールのバージョンなど）

PHP8
Laravel10

Answer 1

検索用の情報だけではなく「検索が押された」ことを示す情報もフラグとしてリクエストパラメータに含み
そのリクエストパラメータがemptyか否かで出力の分岐を掛ければ良いと思います。

それか、初期表示用と検索表示用とでコントローラ（or受け取るコントローラのメソッド）を別にする。
初期表示用で検索処理を書かなければ自然と$roomsはnull（もしくは未定義）になるので、
elseに入ります。
いっそviewも別にしてもいいかもしれませんが、あとはどう表示させたいか、要件次第で決めてください。

Comments

[student]

表示したくない箇所を@isset($keyword)で囲んだことで、検索後に表示することが出来ました。
ありがとうございます。