Laravel 11 E-Commerce - Products Filter By Price

Welcome back to the Laravel E-Commerce Tutorial. In this video, we will learn about filtering products by price.

Step 1: Create Price Variable and Add Where Condition

Go to the ShopController and inside the index function, create a variable for price and add a where condition. Also, return the min_price and max_price to the view as follows:

public function index(Request $request)
{        
     $size = $request->query('size')?$request->query('size'):12;
     $sorting = $request->query('sorting')?$request->query('sorting'):'default';
     $min_price = $request->query('min')?$request->query('min'):1;
     $max_price = $request->query('max')?$request->query('max'):10000;
     $f_brands = $request->query('brands');
     $f_categories = $request->query('categories');

     if($sorting=='date')   
     {
          $products = Product::whereBetween('regular_price',[$min_price,$max_price])
                              ->where(function($query) use ($f_brands){
                                   $query->whereIn('brand_id',explode(',',$f_brands))->orWhereRaw("'".$f_brands."' = ''");
                              })
                              ->where(function($query) use ($f_categories){
                                   $query->whereIn('category_id',explode(',',$f_categories))->orWhereRaw("'".$f_categories."' = ''");
                              })
                              ->orderBy('created_at','DESC')->paginate($size);  
     }
     else if($sorting=="price")
     {
          $products = Product::whereBetween('regular_price',[$min_price,$max_price])
          ->where(function($query) use ($f_brands){
               $query->whereIn('brand_id',explode(',',$f_brands))->orWhereRaw("'".$f_brands."' = ''");
          })
          ->where(function($query) use ($f_categories){
               $query->whereIn('category_id',explode(',',$f_categories))->orWhereRaw("'".$f_categories."' = ''");
          })
          ->orderBy('regular_price','ASC')->paginate($size); 
     }
     else if($sorting=="price-desc")
     {
          $products = Product::whereBetween('regular_price',[$min_price,$max_price])
          ->where(function($query) use ($f_brands){
               $query->whereIn('brand_id',explode(',',$f_brands))->orWhereRaw("'".$f_brands."' = ''");
          })
          ->where(function($query) use ($f_categories){
               $query->whereIn('category_id',explode(',',$f_categories))->orWhereRaw("'".$f_categories."' = ''");
          })
          ->orderBy('regular_price','DESC')->paginate($size); 
     }
     else{
          $products = Product::whereBetween('regular_price',[$min_price,$max_price])
          ->where(function($query) use ($f_brands){
               $query->whereIn('brand_id',explode(',',$f_brands))->orWhereRaw("'".$f_brands."' = ''");
          })
          ->where(function($query) use ($f_categories){
               $query->whereIn('category_id',explode(',',$f_categories))->orWhereRaw("'".$f_categories."' = ''");
          })
          ->paginate($size);  
     }           
     $categories = Category::orderBy("name","ASC")->get();
     $brands = Brand::orderBy("name","ASC")->get();
     return view('shop',compact("products","size","sorting","min_price","max_price","categories","brands","f_brands","f_categories"));
}  

Step 2: Display Price Range on the Shop Page

Now, go to the shop.blade.php file and inside the filter form, add two input hidden fields and set the value of min_price and max_price:

<input type="hidden" name="min" id="hdnMinPrice" value="{{$min_price}}" />
<input type="hidden" name="max" id="hdnMaxPrice" value="{{$max_price}}" />

Step 3: Add JavaScript Function for Price Range Slider

Inside the @push directive, between the script tag, add the following function:

$("[name='price_range']").on("change",function(){
     $("#hdnMinPrice").val($(this).val().split(',')[0]);
     $("#hdnMaxPrice").val($(this).val().split(',')[1]);
     $("#frmfilter").submit();
}); 

Final Step: Check the Price Filter

Now, let's check the price filter. Switch to the browser and refresh the page. Slide the price range slider, and you can see all the products between this price range. Set another price range, and you can see the updated products.

So, in this way, you can filter products by price.

That's all about filtering products by price.