tasdildiren/primevue-datatables

Easy Laravel Server-Side implementation of PrimeVue Datatables

v1.0.0 2023-07-10 12:27 UTC

This package is auto-updated.

Last update: 2024-10-10 15:18:00 UTC


README

Latest Version on Packagist Total Downloads

This is a simple, clean and fluent serve-side implementation of PrimeVue Datatables in Laravel.

image

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 tasdildiren/primevue-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($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:

  1. Searchable Columns (Passed as searchable_columns) - Used to specify the columns that will be used to perform the global datatable search
  2. 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.post('/api/books',{
            dt_params: lazyParams.value,
            searchable_columns: ['title','author.name','price'],
        });

        records.value = res.data.data;
        totalRecords.value = res.data.total;
        loading.value = false;
    } catch (e) {
        records.value = [];
        totalRecords.value = 0;
        loading.value = false;
    }
};

Changelog

Please see CHANGELOG for more information what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security

If you discover any security related issues, please email maosa.sam@gmail.com instead of using the issue tracker.

Credits

License

The MIT License (MIT). Please see License File for more information.