Laravel E-Commerce Project - Add Search on Admin Products Page

In this video, we will learn how to add a search feature to the Admin Products Page.

Let's explore how to achieve this. First, open the AdminProductComponent view file and add an input text field:

<div class="col-md-4">
    <input type="text" class="form-control" wire:model="searchTerm" placeholder="Search..." />
</div>

Next, go to the AdminProductComponent class file and create a new property:

public $searchTerm;

Bind this property to the input text field by adding the following code to the view file: wire:model="searchTerm".

Now, go to the class file and add the following code inside the render method:

public function render()
{     
    $search = '%' . $this->searchTerm . '%';     
    $products = Product::where('name','LIKE',$search)
                ->orWhere('stock_status','LIKE',$search)
                ->orWhere('regular_price','LIKE',$search)
                ->orWhere('sale_price','LIKE',$search)
                ->orderBy('id','DESC')->paginate(10);                
    return view('livewire.admin.admin-product-component',['products'=>$products])->layout('layouts.base');
}

That's it! Let's test the functionality. Switch to the browser and refresh the page.

Try searching for a product by name, and you should see the search results. If you enter a price, you should see the products that match that price.

By following these steps, you can add a search feature to the Admin Products Page.