Laravel Sort shoplist front end - php

Question

Hi i'm doing a shop for a university project. This is my first course in web development and I don't understand how to sort a shoplist page by an html dropdown select in laravel.
Frontend Blade
<div class="toolbar-sorter">
<span>Sort By</span>
<select name="sorter" class="sorter-options" style="width:150px; "data-role="sorter">
<option selected="selected" value='comic_name'>Titolo: A-Z </option>
<option value='comic_name'> Titolo: Z-A </option>
<option value='price'> Prezzo: Crescente </option>
<option value='price'> Prezzo: Decrescente </option>
<option value='created_at'> Ultimi Arrivati </option>
</select>
</div>
Route.php (This is not the only route of shoplist)
Route::get('/shoplist', 'ComicController#shoplistBase');
ComicController
public function shoplistBase()
{
$genres = Genre::all();
$comics = Comic::paginate(9);
return view('shoplist')->with(compact('genres'))->with(compact('comics'));
}

Answer 1

Assuming that you are using the same route for your sorting:
Wrap your drop-down in a form
Make sure to use unique values for each options
<form action="/shoplist" method="GET">
<div class="toolbar-sorter">
<span>Sort By</span>
<select name="sorter" class="sorter-options" style="width:150px; " data-role="sorter">
<option selected="selected" value='comic_name_asc'>Titolo: A-Z</option>
<option value='comic_name_desc'> Titolo: Z-A</option>
<option value='price_asc'> Prezzo: Crescente</option>
<option value='price_desc'> Prezzo: Decrescente</option>
<option value='created_at'> Ultimi Arrivati</option>
</select>
</div>
<button type="submit">Filter</button>
</form>
Handle the filter request in your Controller
public function shoplistBase(Request $request)
{
$genres = Genre::all();
if ($request->has('sorter')){
switch($request->get('sorter')){
case `comic_name_asc`:
$comics = Comic::orderBy('name', 'desc')->paginate(9);
break;
case `comic_name_desc`:
//..
break;
}
} else {
$comics = Comic::paginate(9);
}
return view('shoplist')->with(compact('genres'))->with(compact('comics'));
}