Step 01: Adding following changes in list.blade.php under resources/view/products for search form and filtering links
// search form <div class="row"> <div class="col-md-4"> <h2 class="">All Products</h2> </div> <div class="col-md-4"> <div class=""> <form method="GET" action="{{ route('products.index' ) }}"> <input type="text" name="search_global" class="form-control" placeholder="Filter by name" value="{{ request('search_global', '') }}"> </form> </div> </div> <div class="col-md-4 text-end pt-1"> <a class="btn btn-sm btn-primary" href="{{ route('products.create') }}"> Add Product</a> </div> </div>
// filtering links <thead class="table-dark"> <tr> <th>Id</th> <th class="text-center"><a class="text-info text-decoration-none" href="{{ route('products.index', ['order_column' => 'name', 'order_direction' => ($orderDirection == 'desc') ? 'asc' : 'desc' ]) }}">Name {!! ( ( $orderColumn == 'name' ) && ( $orderDirection !== '' ) ) ? ( ($orderDirection == 'desc') ? '↑' : '↓' ) : '' !!}</a></th> <th class="text-center"><a class="text-info text-decoration-none" href="{{ route('products.index', ['order_column' => 'cost', 'order_direction' => ($orderDirection == 'desc') ? 'asc' : 'desc' ]) }}">Cost {!! ( ( $orderColumn == 'cost' ) && ( $orderDirection !== '' ) ) ? ( ($orderDirection == 'desc') ? '↑' : '↓' ) : '' !!}</a></th> <th class="text-center"><a class="text-info text-decoration-none" href="{{ route('products.index', ['order_column' => 'created_at', 'order_direction' => ($orderDirection == 'desc') ? 'asc' : 'desc' ]) }}">Created {!! ( ( $orderColumn == 'created_at' ) && ( $orderDirection !== '' ) ) ? ( ($orderDirection == 'desc') ? '↑' : '↓' ) : '' !!}</a></th> <th class="text-center"><a class="text-info text-decoration-none" href="{{ route('products.index', ['order_column' => 'sequence', 'order_direction' => ($orderDirection == 'desc') ? 'asc' : 'desc' ]) }}">Order {!! ( ( $orderColumn == 'sequence' ) && ( $orderDirection !== '' ) ) ? ( ($orderDirection == 'desc') ? '↑' : '↓' ) : '' !!}</a></th> <th class="text-center">Actions</th> </tr> </thead>
Above, in filtering order direction logic is implemented on links ( name, cost, created and order ) to make visible or hidden up arrow or down arrow as well as direction of ordering ( asc or desc ) based on correct order coloumn.
Step 02: Then, back in ProductController following changes in index() method for searching and filtering
// searching $query = Product::query(); $keyword = $request->query( 'search_global' ) ?? ''; // eloquent conditional clause $query->when( $keyword , function ($query) use ($keyword) { $query->where( 'name', 'like' , '%'.$keyword.'%' ); }); // filtering $orderColumn = request('order_column', 'sequence'); if (!in_array($orderColumn, ['name', 'cost', 'created_at', 'sequence'])) { $orderColumn = 'sequence'; } $orderDirection = request('order_direction', 'desc'); if (!in_array($orderDirection, ['asc', 'desc'])) { $orderDirection = 'desc'; } $products = $query->orderBy( $orderColumn, $orderDirection )->paginate( 10 )->withQueryString(); // passing orderColumn and orderDirection in blade view return view( 'products.list', compact( 'meta_title','products', 'orderColumn' ,'orderDirection' ) );
So, updated full index() method will be like below
// public function index( Request $request ) { $meta_title = 'All Products'; $orderColumn = request('order_column', 'sequence'); if (!in_array($orderColumn, ['name', 'cost', 'created_at', 'sequence'])) { $orderColumn = 'sequence'; } $orderDirection = request('order_direction', 'desc'); if (!in_array($orderDirection, ['asc', 'desc'])) { $orderDirection = 'desc'; } //used in delete redirection for correct page redirection session('submit_redirect', ''); if($request->query->count() > 0) { // if query string has any value count will be greater than 0 session()->put('submit_redirect', $_SERVER['REQUEST_URI']); //getting current query string from url and saving it to session variable } $query = Product::query(); $keyword = $request->query( 'search_global' ) ?? ''; // eloquent conditional clause $query->when( $keyword , function ($query) use ($keyword) { $query->where( 'name', 'like' , '%'.$keyword.'%' ); }); $products = $query->orderBy( $orderColumn, $orderDirection )->paginate( 10 )->withQueryString(); return view( 'products.list', compact( 'meta_title','products', 'orderColumn' ,'orderDirection' ) ); }
Step 03: Saving sequence of product data by adding following method. Please note this is response method of ajax call which is being created previously.
function saveOrder ( Request $request, Product $product ) { $product->sequence = $request->post( 'order' ); $product->save(); return response()->json($product->sequence,200); }