0

I am trying to make a relatively simple "live search" that queries a Model and returns an interactive list of results. I am using Laravel 8.12 and Livewire 2.3

My Search.php

namespace App\Http\Livewire;

use Livewire\Component;
use App\Models\Event;

class Search extends Component
{
    public $searchTerm;

    public function render(){
        $searchTerm = '%' . $this->searchTerm . '%';
        
        $data = [
            "events" => Event::where('title', 'like', $searchTerm)->get()
        ];

        return view('livewire.search', $data);
    }
}

and my Livewire blade

<div class="search hidden sm:block" style="padding-top: 8px; max-width: 300px;">
    <input type="text" class="search__input input dark:bg-dark-1 placeholder-theme-13" placeholder="Search..." style="max-width: 300px;" wire:model="searchTerm" />
    <i data-feather="search" class="search__icon dark:text-gray-300"></i>
</div>
<div class="search-result show">
    <div class="search-result__content">
        <div class="mb-5">
            Search Results
            @if($searchTerm != "")
                @if($events->isEmpty())
                    <p>No results for {{ $searchTerm }}</p>
                @else
                    <p>{{ $events->count() }} results for {{ $searchTerm }}</p>
                    @foreach($events as $event)
                        <a href="" class="flex items-center">
                            <div class="ml-3">{{ $event->title }}</div>
                        </a>
                    @endforeach
                @endif
            @endif
        </div>
    </div>
</div>

The weird part is I can see results coming back as I type in the console

enter image description here

but the results do not "appear" in front of me. Any help?

enter image description here

markusp
  • 329
  • 1
  • 2
  • 10

1 Answers1

0

Solved by following this post: Livewire Not Rerendering

I needed to restructure my blade file.

markusp
  • 329
  • 1
  • 2
  • 10