How to configure a search box in laravel

Question

I am trying to put a search box in my home.blade but it is not working properly.

Here bellow is my home view

@extends('layouts.app')

@section('content')

    <form action="{{ route('home') }}">

        <div class="p-1 bg-light rounded rounded-pill shadow-sm mb-4">
            <div class="input-group">
                <input type="search" name="search" placeholder="Here the animal serial number..." aria-describedby="button-addon1" class="form-control border-0 bg-light">
                <div class="input-group-append">
                    <button id="button-addon1" type="submit" class="btn btn-link text-primary"><i class="fa fa-search"></i></button>
                </div>
            </div>
        </div>
    </form>
    @foreach($animal as $animal)
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-md-8">
                    <div class="card">
                        <div class="card-header">
                            <h3>Details for the animal</h3>

                        </div>
                        <div class="card-body">
                            <div class="col-12">
                                <p><strong>Id: </strong>{{ $animal->id }}</p>
                                <p><strong>Animal: </strong>{{ $animal->type->category }}</p>
                                <p><strong>Gender: </strong>{{ $animal->gender }}</p>
                                <p><strong>Place Of Birth: </strong>{{ $animal->user->address->city }}</p>
                                <p><strong>Farm: </strong>{{ $animal->user->name }}</p>
                                <p><strong>Date: </strong>{{ $animal->created_at }}</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    @endforeach
    @if(request()->has('search') && request()->get('search') != '')
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-md-8">
                    <div class="card">
                        <div class="card-header">
                            <h3>Details for the animal</h3>

                        </div>
                        <div class="card-body">
                            <div class="col-12">
                                <p><strong>Id: </strong>{{ $animal->id }}</p>
                                <p><strong>Animal: </strong>{{ $animal->type->category }}</p>
                                <p><strong>Gender: </strong>{{ $animal->gender }}</p>
                                <p><strong>Place Of Birth: </strong>{{ $animal->user->address->city }}</p>
                                <p><strong>Farm: </strong>{{ $animal->user->name }}</p>
                                <p><strong>Date: </strong>{{ $animal->created_at }}</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    @endif
@endsection

and my controller

public function index()
{
    $animal =Animal::all();
    if (request()->has('search') && request()->get('search') != ''){
        $animal = $animal->where('serial_number', 'like', "%" .request()->get('search')."%");
    }
    return view('home', compact('animal'))->with('message', 'Below is the result');
}

It bringing me an error like this 'Property [id] does not exist on this collection instance. (View: /Users/macair13/MeatracProject/resources/views/home.blade.php)' meaning the animal I have passed in my controller is not worrking.

Answer 1

There are a few problems to work through.

1) You have a variable name collision -

@foreach($animal as $animal)

This will overwrite your collection of animals ($animal) with the first individual animal in that collection. On the next iteration foreach will try to iterate over each element of that single animal. And those elements (like id) don't themselves have properties like id, so you get the error you are seeing.

You should change your variable names to avoid the collision, for example convention would be to use $animals, plural, to indicate it is a collection of more than one. So:

Controller

$animals = Animal::all();
// ...
return view('home', compact('animals')) ...

View

@foreach($animals as $animal)

2) The search code in your controller:

$animal = $animal->where(...);

does not actually get the results. You need to append get(), as shown in the docs:

$animal = $animal->where(...)->get();

3) As @Rwd pointed out in the comments, your view has 2 separate chunks of content, one which looks like it should display a collection of animals (the top one with foreach), and a second which looks like it should display just the search results. Similar to problem 1 above, you have a name collision here - both sections are using $animal. After the foreach loop has finished, $animal is the last animal in the collection of all animals - not your search result.

If I am understanding correctly, you probably want use 2 separate variable names, maybe $animals at the top to list all animals, and then maybe $result to show a single search result.

If that is true, you need to update as follows:

Controller

// For the top list of all animals
$animals = Animal::all();

// For the single search result
$result = false;
if (request()->has('search') && request()->get('search') != ''){
    $result = $animal->where(...)->get();
}

// Return them both, separately
return view('home', ['animals' => $animals, 'result' => $result])...;

View

@foreach($animals as $animal)

// ...

@if($result)
    {{ $result->id }}