PHPackages                             qbits/laravel-inertia-vue-datatable - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. qbits/laravel-inertia-vue-datatable

ActiveLibrary[Utility &amp; Helpers](/categories/utility)

qbits/laravel-inertia-vue-datatable
===================================

A powerful DataTable package for Laravel + Inertia.js + Vue 3 with server-side pagination, sorting, filtering, row selection, bulk actions, and export.

v1.0.3(1w ago)02↓100%MITVuePHP ^8.1

Since Mar 14Pushed 1w agoCompare

[ Source](https://github.com/RafiqueKhattak/laravel-inertia-vue-datatable)[ Packagist](https://packagist.org/packages/qbits/laravel-inertia-vue-datatable)[ RSS](/packages/qbits-laravel-inertia-vue-datatable/feed)WikiDiscussions main Synced today

READMEChangelogDependencies (5)Versions (3)Used By (0)

Laravel Inertia DataTable
=========================

[](#laravel-inertia-datatable)

A full-featured DataTable package for **Laravel + Inertia.js + Vue 3**.

Features
--------

[](#features)

Feature✓Server-side pagination✅Column sorting (asc/desc)✅Search / filtering✅Row selection + select all✅Bulk actions✅Column visibility toggle✅Export CSV / XLSX✅Custom action buttons (slot)✅Custom cell renderers (slot)✅Debounced search✅---

Installation
------------

[](#installation)

```
composer require qbits/laravel-inertia-vue-datatable
```

Publish config + Vue component:

```
php artisan vendor:publish --tag=datatable-config
php artisan vendor:publish --tag=datatable-components
```

The Vue component will land at:

```
resources/js/vendor/datatable/Components/DataTable.vue

```

---

Backend: Controller
-------------------

[](#backend-controller)

Add the `HasDataTable` trait to any controller and call `$this->dataTable()`:

```
use YourVendor\InertiaDataTable\Traits\HasDataTable;

class UserController extends Controller
{
    use HasDataTable;

    private function columns(): array
    {
        return [
            ['key' => 'id',    'label' => 'ID',    'sortable' => true,  'searchable' => false, 'exportable' => true],
            ['key' => 'name',  'label' => 'Name',  'sortable' => true,  'searchable' => true,  'exportable' => true],
            ['key' => 'email', 'label' => 'Email', 'sortable' => true,  'searchable' => true,  'exportable' => true],
        ];
    }

    public function index()
    {
        $query = User::query();
        $tableData = $this->dataTable($query, $this->columns());

        return Inertia::render('Users/Index', [
            'table' => $tableData,
        ]);
    }

    public function export(Request $request)
    {
        $ids    = array_filter(explode(',', $request->input('ids', '')));
        $format = $request->input('format', 'xlsx');
        $query  = User::query();

        return Excel::download(
            new DataTableExport($query, $this->columns(), $ids),
            'users.' . $format
        );
    }

    public function bulkDestroy(Request $request)
    {
        User::whereIn('id', $request->ids)->delete();
        return back();
    }
}
```

### Routes

[](#routes)

```
Route::get('/users',               [UserController::class, 'index']);
Route::get('/users/export',        [UserController::class, 'export']);
Route::delete('/users/bulk-destroy', [UserController::class, 'bulkDestroy']);
```

---

Column Definition
-----------------

[](#column-definition)

KeyTypeDefaultDescription`key`string*required*Model attribute / DB column`label`string*required*Column header text`sortable`bool`false`Allow sorting by this column`searchable`bool`false`Include in LIKE search`exportable`bool`false`Include in CSV/XLSX export`visible`bool`true`Initial visibility---

Frontend: Vue Component
-----------------------

[](#frontend-vue-component)

```

```

### Props

[](#props)

PropTypeDefaultDescription`columns`ArrayrequiredColumn definitions (from server)`rows`Array`[]`Current page rows`meta`ObjectrequiredPagination meta`filters`Object`{}`Active filter state`rowKey`String`'id'`Unique row identifier`selectable`Boolean`true`Show row checkboxes`showColumnToggle`Boolean`true`Show columns menu`exportable`Boolean`true`Show export buttons`exportUrl`String`''`URL to hit for export`bulkActions`Array`[]``[{ key, label }]``searchDebounce`Number`350`Debounce ms for search input### Events

[](#events)

EventPayloadDescription`bulkAction``{ action: string, ids: number[] }`Fired on bulk action click`selectionChange``number[]`Selected row IDs### Slots

[](#slots)

SlotPropsDescription`cell-{key}``{ row, value }`Custom cell renderer per column`rowActions``{ row }`Action buttons at end of each row`actions`—Extra buttons in the toolbar---

Configuration
-------------

[](#configuration)

`config/datatable.php`

```
return [
    'per_page'         => 15,
    'per_page_options' => [10, 15, 25, 50, 100],
    'export_filename'  => 'export',
];
```

---

Requirements
------------

[](#requirements)

- PHP 8.1+
- Laravel 10 or 11
- Inertia.js + Vue 3
- `maatwebsite/excel` ^3.1

---

License
-------

[](#license)

MIT

###  Health Score

39

—

LowBetter than 87% of packages

Maintenance98

Actively maintained with recent releases

Popularity3

Limited adoption so far

Community6

Small or concentrated contributor base

Maturity43

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~0 days

Total

2

Last Release

9d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/4d8bb735fd931671a0280f085a521f2d15192407ecd72d430430dd1ca26bfeb3?d=identicon)[RafiqueKhattak](/maintainers/RafiqueKhattak)

---

Top Contributors

[![RafiqueKhattak](https://avatars.githubusercontent.com/u/174876750?v=4)](https://github.com/RafiqueKhattak "RafiqueKhattak (4 commits)")

---

Tags

laravelpaginationinertiatabledatatablevueqbits

###  Code Quality

TestsPHPUnit

### Embed Badge

![Health badge](/badges/qbits-laravel-inertia-vue-datatable/health.svg)

```
[![Health](https://phpackages.com/badges/qbits-laravel-inertia-vue-datatable/health.svg)](https://phpackages.com/packages/qbits-laravel-inertia-vue-datatable)
```

###  Alternatives

[santigarcor/laravel-vuetable

Vuetable laravel backend package

2750.2k](/packages/santigarcor-laravel-vuetable)[awes-io/table-builder

A component that allows creating responsive HTML tables or lists from data object

4726.1k1](/packages/awes-io-table-builder)[tomshaw/electricgrid

A feature-rich Livewire package designed for projects that require dynamic, interactive data tables.

115.5k](/packages/tomshaw-electricgrid)[ctsoft/laravel-pretty-pagination

Pretty pagination URLs for Laravel.

171.7k](/packages/ctsoft-laravel-pretty-pagination)[mtrdesign/krait

Krait provides an easy way to create Ajax Datatables.

101.9k](/packages/mtrdesign-krait)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
