tekrow / laravel-prime-datatables
Laravel Server-Side implementation of PrimeVue Datatables
Requires
- php: ^7.4|^8.0|^8.1
- illuminate/support: ^8.0|^9.0
Requires (Dev)
- orchestra/testbench: ^6.0|^7.0
- phpunit/phpunit: ^9.0
This package is not auto-updated.
Last update: 2024-11-14 12:16:05 UTC
README
This is a simple, clean and fluent serve-side implementation of PrimeVue Datatables in Laravel.
Features
- Global Search including searching in relationships up to a depth of 3, e.g
author.user.name
- Per-Column filtering out of the box
- Column Sorting with direction toggling
- Pagination with a dynamic
no. or records per page
setting - Fully compatible with PrimeVue Datatable
Installation
You can install the package via composer:
composer require tekrow/laravel-prime-datatables
Usage
Server Side
It is as simple as having this in your index()
function of your controller:
public function index(Request $request): JsonResponse { $list = PrimevueDatatables::of(Book::query())->make(); return response()->json([ 'success' => true, 'payload' => $list, ]); }
Required Query Parameters
The server-side implementation uses two parameters from your laravel request object to perform filtering, sorting and pagination: You have to pass the following parameters as query params from the client:
- Searchable Columns (Passed as
searchable_columns
) - Used to specify the columns that will be used to perform the global datatable search - Dt Params (Passed as
dt_params
) - This is the main Datatable event object as received from PrimeVue. See Lazy Datatable documentation for more details
Client Side:
Go through PrimeVue's Lazy Datatable documentation for details on frontend implementation.
Here is an example of your loadLazyData()
implementation:
const loadLazyData = async () => { loading.value = true; try { const res = await axios.get('/api/vehicles',{ params: { dt_params: JSON.stringify(lazyParams.value), searchable_columns: JSON.stringify(['title','type.name','price']), }, }); records.value = res.data.payload.data; totalRecords.value = res.data.payload.total; loading.value = false; } catch (e) { records.value = []; totalRecords.value = 0; loading.value = false; } };
License
The MIT License (MIT). Please see License File for more information.