CODEWITHSUNDEEP
laravellaravel-livewire
d.shved
d.shved

Reputation: 11

Livewire Search doesn't work correctly - always returns the same result

I'm facing an issue using Livewire and Laravel. I'm trying to implement search functionality for products on a page, but typing into the search bar always returns the same result, even if the search text changes. Here is the code of my livewire class:

ProductList.php





<?php

namespace App\Livewire;

use App\Models\Cigarette;
use App\Models\Liquid;
use Livewire\Component;
use Gloudemans\Shoppingcart\Facades\Cart;

class ProductList extends Component
{
    public $search = '';

    public function render()
    {
        $searchTerm = trim($this->search);

        $filteredCigarettes = Cigarette::whereRaw('LOWER(name) like ?', ['%' . strtolower($searchTerm) . '%'])->get();
        $filteredLiquids = Liquid::whereRaw('LOWER(name) like ?', ['%' . strtolower($searchTerm) . '%'])->get();

        return view('livewire.product-list', [
            'cigarettes' => $filteredCigarettes,
            'liquids' => $filteredLiquids,
        ]);
    }
}

and here is the view of this livewire class:





<div class="grid">

    <input wire:model.live.debounce.1000ms="search" class="searchbar" type="text">

    {{-- Cigarettes --}}
    @forelse($cigarettes as $cigarette)
        <livewire:cigarette-card :cigarette="$cigarette"/>
    @empty
        <div class="#">
            No cigarettes in the database
        </div>
    @endforelse

    {{-- Liquids --}}
    @forelse($liquids as $liquid)
        <livewire:liquid-card :liquid="$liquid"/>
    @empty
        <div class="#">
            No liquids in the database
        </div>
    @endforelse
</div>

After some dump:





class ProductList extends Component
{
    public $search = '';

    public function render()
    {
        $searchTerm = trim($this->search);

        dump($this->search);

        dump(Cigarette::where('name', 'like', '%'.'Gene'.'%')->get());

        $filteredCigarettes = Cigarette::whereRaw('LOWER(name) like ?', ['%' . strtolower($searchTerm) . '%'])->get();
        $filteredLiquids = Liquid::whereRaw('LOWER(name) like ?', ['%' . strtolower($searchTerm) . '%'])->get();

        dump($filteredCigarettes);

        return view('livewire.product-list', [
            'cigarettes' => $filteredCigarettes,
            'liquids' => $filteredLiquids,
        ]);
    }
}

i got this:





"gene" // app\Livewire\ProductList.php:20 

Illuminate\Database\Eloquent\Collection {#1345 ▼ // app\Livewire\ProductList.php:22
  #items: array:1 [▶]
  #escapeWhenCastingToString: false
}
Illuminate\Database\Eloquent\Collection {#581 ▼ // app\Livewire\ProductList.php:27
  #items: array:1 [▶]
  #escapeWhenCastingToString: false
}

When I enter text into the search field, the query always returns only one result - "Pod Smok System". And it looks like: https://i.ibb.co/f0ZH7PB/2024-12-11-094813.jpg

My database table with cigarettes looks like: https://i.ibb.co/0tQ6cgg/2024-12-11-094127.jpg

I tried using whereRaw('LOWER(name) like ?', ...) to be case sensitive, but the problem persisted. Also, I added debounce.500ms to the input field to reduce the frequency of requests to the server.

How can I properly configure Livewire search so that it updates correctly every time I type and returns the correct results instead of always returning the same results?

I would be grateful for your help!

Upvotes: 1

Views: 55

Answers (1)

Ali Haroon
Ali Haroon

Reputation: 65

Try making separate variables for cigarettes and liquids and update them when the search changes. Or you can write properties like this

public function getFilteredLiquidsProperty()
{
    $searchTerm = trim($this->search);
    return Liquid::where('name', 'like', "%{$searchTerm}%")->get();
}

and then pass them like this

return view('livewire.product-list', [
        'liquids' => $this->filteredLiquids,
    ]);

Or a lifecycle hook

public $cigarettes = [];
public $liquids = [];

public function updatedSearch($value)
{
    $searchTerm = trim($value);

    $this->cigarettes = Cigarette::where('name', 'like', "%{$searchTerm}%")->get();
    $this->liquids = Liquid::where('name', 'like', "%{$searchTerm}%")->get();
}

public function render()
{
    return view('livewire.product-list', [
        'cigarettes' => $this->cigarettes,
        'liquids' => $this->liquids,
    ]);
}

Upvotes: 1

Related Questions